Termasuk tag jangkar dalam ASP.NET MVC Html.ActionLink

151

Di ASP.NET MVC, saya mencoba membuat tautan yang menyertakan tag jangkar (yaitu mengarahkan pengguna ke halaman, dan bagian halaman tertentu).

URL yang saya coba buat harus terlihat seperti berikut:

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

Perutean saya diatur dengan standar:

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

Sintaks tautan aksi yang saya gunakan adalah:

<%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>
<%} %>

Metode pengontrol saya adalah sebagai berikut:

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

   return View(itemList);
}

Di atas dengan benar mengembalikan URL sebagai berikut:

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

Saya tidak tahu bagaimana cara menambahkan bagian # section12 . Kata "bagian" hanyalah konvensi yang saya gunakan untuk memecah bagian halaman, dan 12 adalah ID dari subkategori, yaitu, child.ID.

Bagaimana saya bisa melakukan ini?

dp.
sumber

Jawaban:

97

Saya mungkin akan membangun tautan secara manual, seperti ini:

<a href="<%=Url.Action("Subcategory", "Category", new { categoryID = parent.ID }) %>#section12">link text</a>
LorenzCK
sumber
20
Harus benar-benar menggunakan kelebihan untuk ActionLink seperti yang dijelaskan oleh @Brad Wilson.
mattruma
18
@mattruma maaf saya tidak setuju. CIUMAN. Mengapa ada anggota yang penuh dengan parameter, beberapa di antaranya dibiarkan nol, ketika Anda bisa menyatakannya secara eksplisit. Siapa pun dapat melihat apa yang dimaksud di atas di mana respons Brad berbelit-belit dan mengharuskan Anda menggali intellisense. Terlalu banyak parameter adalah pola anti yang dikenali .. c2.com/cgi/wiki?TooManyParameters
Ed Blackburn
2
Saya setuju. Kedua metode berfungsi, tetapi karena cara fragmen yang ditentukan dalam URL tidak akan berubah dalam waktu dekat, saya pikir cara ini sebenarnya lebih mudah dibaca dan lebih jelas dalam tujuannya. Jika perlu, Anda masih dapat memperluas objek Urlatau Htmldengan metode kustom yang mencakup cara sederhana untuk menambahkan string fragmen.
LorenzCK
282

Ada kelebihan ActionLink yang mengambil parameter fragmen . Melewati "section12" sebagai fragmen Anda akan memberi Anda perilaku yang Anda cari.

Misalnya, memanggil Metode 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) %>
Brad Wilson
sumber
1
Apakah kelebihan ini merupakan bagian dari pustaka ekstensi? Saya sepertinya tidak mendapatkannya.
granat
Ada dua: public static string ActionLink (ini HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, protokol string, hostName string, fragmen string, object routeValues, objek htmlAttributes); public static string ActionLink (ini HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, protokol string, hostName string, fragmen string, RouteValueDictionary routeValues, IDictionary <string, objek> htmlAttributes);
Brad Wilson
11
Ini seharusnya jawabannya.
Rubens Mariuzzo
1
Kelebihan Html.ActionLink yang memungkinkan spesifikasi jangkar dengan melewati fragmen, memaksa Anda untuk melewati pengontrol dengan nama. Saya tidak suka itu. Jika nama pengontrol salah, pengecualian run-time akan terjadi, bukan kesalahan kompilasi.
R. Schreurs
1
@RobertMcKee jika teks tautan Anda lebih dari sekadar teks, maka Html.ActionLink()tidak akan berfungsi dalam skenario apa pun - Anda harus menggunakan [email protected]()sintaks gaya.
Katstevens
15

Saya tidak ingat di mana versi ASP.NET MVC (ASP.NET MVC 3+ saya percaya) / Cukur parameterlabeldeclaration atau apa pun namanya (parameter: x) fitur diperkenalkan, tetapi bagi saya ini jelas cara yang tepat untuk membangun tautan dengan jangkar di ASP.NET MVC.

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

Bahkan argumen antipattern Ed Blackburn dari jawaban ini tidak bisa bersaing dengan itu.

Kucing dalam sepatu
sumber
1
Secara harfiah ini menyelamatkan hidup saya. Mengaitkan posting Anda sebagai solusi saya di sini stackoverflow.com/questions/32420028/… .
Matius
11

Saya hanya melakukannya seperti ini:

<a href="@Url.Action("Index","Home")#features">Features</a>
Zapnologica
sumber
1

Inilah contoh kehidupan nyata

@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")

Dan halaman target memiliki TABS

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

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

Solusi saya akan berfungsi jika Anda menerapkan ActionFilter ke metode tindakan Subkategori, selama Anda selalu ingin mengarahkan pengguna ke bookmark yang sama:

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

Ini memodifikasi buffer HTML dan menghasilkan sepotong kecil javascript untuk menginstruksikan browser untuk menambahkan bookmark.

Anda dapat memodifikasi javascript untuk menggulir secara manual, alih-alih menggunakan bookmark di URL, tentu saja!

Semoga bermanfaat :)

Spikeh
sumber
0

Saya melakukan itu dan itu berfungsi untuk mengarahkan kembali ke tampilan lain saya pikir Jika Anda menambahkan #sectionLink setelah itu akan berhasil

<a class="btn yellow" href="/users/Create/@Model.Id" target="_blank">
                                        Add As User
                                    </a>
Ahmed Samir
sumber