如何在ASP.NET MVC中的HTML-5 data- *属性中使用破折号

耗尽温柔 提交于 2020-03-18 17:53:57

3 月,跳不动了?>>>

我试图在我的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>
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!