web-dev-qa-db-ja.com

グリフィコンと異なるフォントのテキストを含むASP.NET Actionlink

ボタンを@Html.ActionLinkで表示したいのですが、テキストにアプリケーションフォントが必要です。

このコードでは：

<span>
    @Html.ActionLink("  Create New", "Create", null, new { @class = "btn btn-warning glyphicon glyphicon-plus-sign" })
</span>

ボタンを取得しましたが、グリフィコンフォントファミリで新規作成テキストが表示されます。

グリフィコンクラスをスパンに配置しても何も変わりません

asp.net-mvctwitter-bootstraprazorglyphicons
58
e4rthdog

グリフィコンクラスをaタグに追加しないでください。

Bootstrap Webサイトから：

他のコンポーネントと混合しないでくださいアイコンクラスを他のコンポーネントと直接結合することはできません。同じ要素の他のクラスと一緒に使用しないでください。代わりに、ネストされた<span>を追加し、アイコンクラスを<span>に適用します。

空の要素でのみ使用アイコンクラスは、テキストコンテンツを含まず、子要素を持たない要素でのみ使用する必要があります。

言い換えれば、これがあなたが望むように動作するための正しいHTMLは次のようになります：<a href="#" class="btn btn-warning">test <span class="glyphicon glyphicon-plus-sign"></span></a>

これにより、Html.ActionLinkヘルパーが不適切になります。代わりに、次のようなものを使用できます。

<a href="@Url.Action("Action", "Controller")" class="btn btn-warning">
    link text 
    <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
</a>
139
Robban

これは、MVC 5で機能します。

@Html.ActionLink(" ", "EditResources", "NicheSites", new { ViewBag.dbc, item.locale, ViewBag.domainId, domainName = ViewBag.domaiName }, new {@class= "glyphicon glyphicon-edit" })

最初のパラメーターは空またはヌルにすることはできません。

22
Norbert Norbertson

HtmlHelper.ActionLink...で動作させるよりも、HTMLを書き出す方が良いかもしれません。

<span>
    <a href="@Url.Action("Create")" class="btn btn-warning">
        <span class="glyphicon glyphicon-plus-sign"></span>
        Create New
    </a>
</span>
9
Anthony Chu

これが私のアンドレイ・ブリキンに触発

public static class BensHtmlHelpers
{
    public static MvcHtmlString IconLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues, String iconName, object htmlAttributes = null)
    {
        var linkMarkup = htmlHelper.ActionLink(linkText, actionName, routeValues, htmlAttributes).ToHtmlString();
        var iconMarkup = String.Format("<span class=\"{0}\" aria-hidden=\"true\"></span>", iconName);
        return new MvcHtmlString(linkMarkup.Insert(linkMarkup.IndexOf(@"</a>"), iconMarkup));
    }
}
5
Ben Hale

それを試してみてください！

 @ Html.ActionLink（ "Cerrarsesión"、 "Login"、 "Account"、routeValues：null、htmlAttributes：new {id = "loginLink"、@class = "glyphicon glyphicon-log-in"}）
2
Charlie

単純な拡張機能を使用できます。

private static readonly String SPAN_FORMAT = "<span class=\"{0}\" aria-hidden=\"true\"></span>";
private static readonly String A_END = "</a>";
public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues, String iconName, object htmlAttributes = null)
{
    var linkMarkup = htmlHelper.ActionLink(linkText, actionName, routeValues, htmlAttributes).ToHtmlString();
    if (!linkMarkup.EndsWith(A_END))
        throw new ArgumentException();

    var iconMarkup = String.Format(SPAN_FORMAT, iconName);
    return new MvcHtmlString(linkMarkup.Insert(linkMarkup.Length - A_END.Length, iconMarkup));
}

使用法：

Html.ActionLink(" ", "DeleteChart", new { Id = _.Id }, "glyphicon glyphicon-trash")
2
Andrey Burykin

@Url.Actionの代わりに@Html.ActionLinkのアプローチを使用する必要があります。以下のサンプルコードをご覧ください。

<span>
<a href="@Url.Action("Create", new { @class = "btn btn-warning" })"><span class="glyphicon glyphicon-plus-sign"></span> Create New</a>
</span>
2
Webking

これを試してみましょう。動作しているかどうか教えてください。ありがとう

<style>
   span.super a
  {
      font: (your application font) !important;
  }

</style>

<span class="super">
    @Html.ActionLink("  Create New", "Create", null, new { @class = "btn btn-warning glyphicon glyphicon-plus-sign" })
</span>
0
Hatjhie

これを試して。私のために働いた。

<button class="btn btn-primary"><i class ="fa fa-plus">@Html.ActionLink(" ", "Create", "Home")</i></button>
0
Aayush Rajopadhyaya

FormMethod.Get/FormMethod.PostでHtml.BeginFormを使用する方法

@using (Html.BeginForm("Action", "Controller", new { Area = "" },
FormMethod.Get, htmlAttributes: new { title = "SomeTitle" }))
{   
   <button type="submit" class="btn-link" role="menuitem">
   <i class="glyphicon glyphicon-plus-sign"></i>Create New</button>
}
0
HostMyBus