ASP.NET MVC Html.ActionLinkにアンカータグを含める


151

ASP.NET MVCでは、アンカータグを含むリンクを作成しようとしています(つまり、ユーザーをページとページの特定のセクションに誘導しています)。

作成しようとしているURLは次のようになります。

<a href="/category/subcategory/1#section12">Title for a section on the page</a>

私のルーティングは標準で設定されています:

routes.MapRoute("Default", "{controller}/{action}/{categoryid}"); 

私が使用しているアクションリンク構文は次のとおりです。

<%foreach (Category parent in ViewData.Model) { %>
<h3><%=parent.Name %></h3>
<ul>
<%foreach (Category child in parent.SubCategories) { %>
    <li><%=Html.ActionLink<CategoryController>(x => x.Subcategory(parent.ID), child.Name) %></li>
<%} %>
</ul>
<%} %>

私のコントローラーメソッドは次のとおりです。

public ActionResult Subcategory(int categoryID)
{
   //return itemList

   return View(itemList);
}

上記は、次のように正しくURLを返します。

<a href="/category/subcategory/1">Title for a section on the page</a>

#section12パーツを追加する方法がわかりません。「セクション」という単語は、ページセクションを分割するために私が使用している規則にすぎず、12はサブカテゴリのID、つまりchild.IDです。

これどうやってするの?

回答:


97

おそらく、次のようにリンクを手動で作成します。

<a href="<%=Url.Action("Subcategory", "Category", new { categoryID = parent.ID }) %>#section12">link text</a>

20
@Brad Wilsonで説明されているように、ActionLinkのオーバーロードを実際に使用する必要があります。
mattruma 2010

18
@mattrumaごめんなさい。接吻。単純に明示的に述べることができるのに、一部のパラメーターがnullのままになっているパラメーターでメンバーがいっぱいになる理由。ブラッドの応答が複雑で、インテリセンスを掘り下げることを要求する上記の意味を誰でも見ることができます。パラメータが多すぎると、認識されるアンチパターンになります。c2.com/ cgi / wiki?TooManyParameters
Ed Blackburn

2
同意する。どちらの方法でも機能しますが、URLでフラグメントを指定する方法は近い将来変更される予定がないため、この方法の方が実際にはより読みやすく、明確であると思います。必要に応じて、フラグメント文字列を追加する簡単な方法を含むカスタムメソッドでUrlまたはHtmlオブジェクトを拡張できます。
LorenzCK

282

フラグメントパラメータを取るActionLinkのオーバーロードがあります。フラグメントとして「section12」を渡すと、目的の動作が得られます。

たとえば、LinkExtensions.ActionLinkメソッド(HtmlHelper、String、String、String、String、String、String、Object、Object)の呼び出し:

<%= Html.ActionLink("Link Text", "Action", "Controller", null, null, "section12-the-anchor", new { categoryid = "blah"}, null) %>

1
これらのオーバーロードは拡張ライブラリの一部ですか?入手できないようです。
グレネード

2つあります:public static string ActionLink(this HtmlHelper htmlHelper、string linkText、string actionName、string controllerName、string protocol、string hostName、string fragment、object routeValues、object htmlAttributes); public static string ActionLink(this HtmlHelper htmlHelper、string linkText、string actionName、string controllerName、string protocol、string hostName、string fragment、RouteValueDictionary routeValues、IDictionary <string、object> htmlAttributes);
ブラッドウィルソン

11
これが答えになるはずです。
ルーベンスマリウッゾ

1
フラグメントを渡すことでアンカーを指定できるHtml.ActionLinkのオーバーロードは、コントローラーを名前で渡すことを強制します。嫌いです。コントローラ名が正しくない場合、コンパイルエラーではなく実行時例外が発生します。
R. Schreurs 2013年

1
@RobertMcKeeリンクテキストが単なるテキストでHtml.ActionLink()はない場合、どのシナリオでも機能しません- href=@Url.Action()スタイル構文を使用する必要があります。
Katstevens 2017年

15

どのバージョンのASP.NET MVC(ASP.NET MVC 3+と思います)/かみそりパラメーターラベル宣言またはそれと呼ばれるもの(パラメーター:x)機能が導入されたかは覚えていませんが、これは間違いなく適切な方法ですASP.NET MVCでアンカー付きのリンクを作成します。

@Html.ActionLink("Some link text", "MyAction", "MyController", protocol: null, hostName: null, fragment: "MyAnchor", routeValues: null, htmlAttributes: null)

この回答からのエドブラックバーンズの反パターン論でさえ、それと競合することはできません。


1
文字通り、これは私の命を救った。ここで私の解決策としてあなたの投稿に起因するstackoverflow.com/questions/32420028/…
マシュー


1

これが実際の例です

@Html.Grid(Model).Columns(columns =>
    {
           columns.Add()
                   .Encoded(false)
                   .Sanitized(false)
                   .SetWidth(10)
                   .Titled(string.Empty)
                   .RenderValueAs(x => @Html.ActionLink("Edit", "UserDetails", "Membership", null, null, "discount", new { @id = @x.Id }, new { @target = "_blank" }));

  }).WithPaging(200).EmptyText("There Are No Items To Display")

そして、ターゲットページにはタブがあります

<ul id="myTab" class="nav nav-tabs" role="tablist">

        <li class="active"><a href="#discount" role="tab" data-toggle="tab">Discount</a></li>
    </ul>

0

ユーザーを常に同じブックマークにリダイレクトしたい限り、ActionFilterをSubcategoryアクションメソッドに適用すると、私の解決策が機能します。

http://spikehd.blogspot.com/2012/01/mvc3-redirect-action-to-html-bookmark.html

HTMLバッファーを変更し、ブラウザーにブックマークを追加するように指示する小さなJavaScriptを出力します。

もちろん、URLでブックマークを使用する代わりに、JavaScriptを変更して手動でスクロールすることもできます。

それが役に立てば幸い :)


0

私はそれをしました、そしてそれは他のビューにリダイレクトするために機能します私はそれが機能する後に#sectionLinkを追加すると

<a class="btn yellow" href="/users/Create/@Model.Id" target="_blank">
                                        Add As User
                                    </a>
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.