我试图在我的ASP.NET MVC 1项目中使用HTML5数据属性 。 (我是C#和ASP.NET MVC的新手。)
<%= Html.ActionLink("« Previous", "Search",
new { keyword = Model.Keyword, page = Model.currPage - 1},
new { @class = "prev", data-details = "Some Details" })%>
上面的htmlAttributes中的“data-details”给出以下错误:
CS0746: Invalid anonymous type member declarator. Anonymous type members
must be declared with a member assignment, simple name or member access.
它在我使用data_details时有效,但我想它需要按照规范以“data-”开头。
我的问题:
- 有没有办法让这个工作,并使用HTML5数据属性与Html.ActionLink或类似的Html助手?
- 是否有其他替代机制将自定义数据附加到元素? 此数据稍后将由JS处理。
#1楼
它比上面提到的一切都更容易。 MVC中包含破折号( - )的数据属性通过使用下划线(_)来满足。
<%= Html.ActionLink("« Previous", "Search",
new { keyword = Model.Keyword, page = Model.currPage - 1},
new { @class = "prev", data_details = "Some Details" })%>
我看到JohnnyO已经提到了这一点。
#2楼
更新:MVC 3和更新版本内置了对此的支持。 有关推荐的解决方案,请参阅下面的JohnnyO高度评价的答案。
我不认为有任何直接的帮助来实现这一点,但我有两个想法让你尝试:
// 1: pass dictionary instead of anonymous object
<%= Html.ActionLink( "back", "Search",
new { keyword = Model.Keyword, page = Model.currPage - 1},
new Dictionary<string,Object> { {"class","prev"}, {"data-details","yada"} } )%>
// 2: pass custom type decorated with descriptor attributes
public class CustomArgs
{
public CustomArgs( string className, string dataDetails ) { ... }
[DisplayName("class")]
public string Class { get; set; }
[DisplayName("data-details")]
public string DataDetails { get; set; }
}
<%= Html.ActionLink( "back", "Search",
new { keyword = Model.Keyword, page = Model.currPage - 1},
new CustomArgs( "prev", "yada" ) )%>
只是想法,没有测试过。
#3楼
我最终使用了一个普通的超链接和Url.Action
,如:
<a href='<%= Url.Action("Show", new { controller = "Browse", id = node.Id }) %>'
data-nodeId='<%= node.Id %>'>
<%: node.Name %>
</a>
这是更丑陋的,但你对a
标签有了更多的控制权,这在很多AJAXified网站中有时很有用。
HTH
#4楼
你可以像这样使用它:
在Mvc:
@Html.TextBoxFor(x=>x.Id,new{@data_val_number="10"});
在Html中:
<input type="text" name="Id" data_val_number="10"/>
#5楼
在mvc 4中可以使用下划线(“_”)渲染
剃刀:
@Html.ActionLink("Vote", "#", new { id = item.FileId, }, new { @class = "votes", data_fid = item.FileId, data_jid = item.JudgeID, })
呈现的Html
<a class="votes" data-fid="18587" data-jid="9" href="/Home/%23/18587">Vote</a>
来源:oschina
链接:https://my.oschina.net/u/3797416/blog/3197580