4

ASP.MVC 3または4（Razorを使用）では、CSSクラスをUrl.Action（）ヘルパーメソッドにどのように適用しますか？出来ますか？

望ましい結果：

<a href="home\index?page=2" class="FOO">BAR</a>

私はこれまでに得ました：

@Url.Action("Index", "Home", new { page })

更新：すべてに感謝します。私は将来の読者（おそらく私自身）のために明確にすべきいくつかの間違いを犯しました。私はあなたの複数のクレジットを与えることができればいいのにと思います。

a）新しい{ページ}-これを行わないでください。望ましくない出力が生成されます。つまり、ViewBag.pageまたはViewBag.pageNum

b）ご指摘のとおり、URLだけでなく完全なタグの生成に切り替えるまで使用していたUrl.Action（）ではなく、Html.ActionLink（）が必要でした。

以下が希望どおりに機能することを確認しました。

@Html.ActionLink("BAR", "Index", "Home", new { ViewBag.PageNum }, new { @class = "FOO" })
4

4 に答える 4

13

ActionLink代わりに使いたいと思います。これにより、必要な属性を追加できます。

@Html.ActionLink("BAR", "Index", "Home", new { page }, new { @class = "FOO" })

出力：

<a href="home/index?page=2" class="FOO">BAR</a>

または「手動で」行うことができます

<a href="@Url.Action("Index", "Home", new { page })" class="FOO">BAR</a>
于 2012-05-14T18:43:45.710 に答える
6

Url.Actionはhtml要素を作成せず、URLのみを作成します。そのため、Html.ActionではなくUrl.Actionと呼ばれます...（Html.Actionはまったく異なるものです）。

Url.Actionを使用するリンクでcssが必要な場合は、次のようにします。

<a href="@Url.Action("Action", "Controller")" class="myclass">My Link<a>

または、Html.ActionLinkを使用することもできます

@Html.ActionLink("My Link", "Action", "Controller", null, new { @class="myclass" })
于 2012-05-14T18:47:29.890 に答える
1

Url.Actionヘルパーは、完全なアンカーではなく、単にURLを出力します。

2つのオプションは次のとおりです。

@Html.ActionLink("BAR", "index","home", new { @class = "FOO" })
  • クラスは予約キーワードであるため、クラスでの@記号の使用に注意してください。

および（Url.Actionヘルパーを使用）

<a href="@Url.Action("Index", "Home", new { page })" class="FOO">BAR</a>
于 2012-05-14T18:48:27.440 に答える
0

これが私がすることです：

私はこのクラスを持っています：

public class HtmlValues : Dictionary<string,object>
{
    public HtmlValues Class(string ClassName)
    {
        if (this.ContainsKey("class"))
        {
            ClassName = String.Format("{0} {1}", this["class"], ClassName);
            this.Remove("class");
        }
        return this.WithValue("class", ClassName);
    }
    public HtmlValues Name(string Name)
    {
        return this.WithValue("name", Name);
    }
    public HtmlValues Style(string Style)
    {
        return this.WithValue("style", Style);
    }
    public HtmlValues MaxLength(int Length)
    {
        return this.WithValue("maxlength", Length.ToString());
    }
    public HtmlValues RTL()
    {
        return this.WithValue("dir", "rtl");
    }
    public HtmlValues With(string Attribute, string Value)
    {
        return this.WithValue(Attribute, Value);
    }

    public static HtmlValues WithClass(string CssClass)
    {
        return new HtmlValues().Class(CssClass);
    }

    public HtmlValues Data(string key, string value)
    {
        return this.WithValue("data-" + key, value);
    }
}

この拡張メソッドを使用すると、次のようになります。

public static class Extensions
{
    public static T WithValue<T>(this T dict, string key, object value) where T : IDictionary<string, object>
    {
        dict.Add(key, value);
        return dict;
    }
}

次に、私のかみそりは次のようになります。

@Html.TextBoxFor(model => model.SomeProperty, HtmlValues.WithClass("SomeClass"))

これはやり過ぎのように思えるかもしれませんが、読者のファッションに意味のある流暢な方法で要素に属性/値を連鎖的に追加できるため、実際にはかなり便利です。

@Html.TextBoxFor(model => model.SomeProperty, 
    HtmlValues.WithClass("SomeClass")
              .Class("someotherClass")
              .Data("Some-Jquery-Data-Thing")
              .With("Nonstandard-Attribute","Its-Value"))
于 2012-05-14T18:45:08.497 に答える