单选按钮生成HTML重复ID-S [英] Radio Button generates duplicate HTML id-s
问题描述
似乎默认的ASP.NET MVC2 HTML辅助生成的重复HTML标识使用code这样的时候（EditorTemplates / UserType.ascx）：
It seems that the default ASP.NET MVC2 Html helper generates duplicate HTML IDs when using code like this (EditorTemplates/UserType.ascx):
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<UserType>" %>
<%: Html.RadioButton("", UserType.Primary, Model == UserType.Primary) %>
<%: Html.RadioButton("", UserType.Standard, Model == UserType.Standard) %>
<%: Html.RadioButton("", UserType.ReadOnly, Model == UserType.ReadOnly) %>
它产生的HTML是：
The HTML it produces is:
<input checked="checked" id="UserType" name="UserType" type="radio" value="Primary" />
<input id="UserType" name="UserType" type="radio" value="Standard" />
<input id="UserType" name="UserType" type="radio" value="ReadOnly" />
这清楚地说明了一个问题。所以，我必须滥用助手什么的。
That clearly shows a problem. So I must be misusing the Helper or something.
我可以手动指定 ID 作为HTML属性但我不能保证这将是独一无二的。
I can manually specify the id as html attribute but then I cannot guarantee it will be unique.
所以，问题是如何确保通过单选助手生成的ID都是唯一的的每个值和仍preserve公约作为生成这些ID（所以嵌套模型得到尊重？（preferably不能手动生成的ID）。
So the question is how to make sure that the IDs generated by RadioButton helper are unique for each value and still preserve the conventions for generating those IDs (so nested models are respected? (Preferably not generating IDs manually.)
推荐答案
我面临同样的问题。 Specyfying标识手动似乎是唯一的解决办法。如果你不需要IDS的东西（比如JavaScript），但希望它不仅是唯一的，你可以为他们生成的GUID：
I faced the same problem. Specyfying IDs manually seems to be the only solution. If you don't need the ids for anything (like javascript), but want it only to be unique you could generate Guids for them:
<%: Html.RadioButton("", UserType.Primary, Model == UserType.Primary, new { id="radio" + Guid.NewGuid().ToString()}) %>
一个更优雅的解决方案是创建的HtmlHelper 自己的扩展方法从视图不同的ID创建逻辑。是这样的：
A more elegant solution would be to create your own extension method on HtmlHelper to separate ID creation logic from the view. Something like:
public static class HtmlHelperExtensions
{
public static MvcHtmlString MyRadioButtonFor<TModel, TValue>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>> expression, bool value)
{
string myId = // generate id...
return htmlHelper.RadioButtonFor(expression, value, new {id=myId});
}
}
辅助方法可以使用ViewContext和模型数据创造更多meaningfull标识。
The helper method could use ViewContext and Model data to create more meaningfull IDs.
更新：
如果您使用EditorTemplates呈现这样的控制
If you use EditorTemplates to render the control like this
<%= Html.EditorFor(m=>m.User, "MyUserControl") %>
然后里面的MyUserControl.ascx（放在〜/查看/共享/ EditorTemplates），可以使用 ViewData.TemplateInfo.HtmlField preFIX 属性来访问父控制ID或 Html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldId（MyPostfixPart）来产生prefixed ID。 Theese的方法可以在该辅助分机以上使用。
同样的作品与 Html.Editor（...）和 Html.EditorForModel（...）渲染控制。在 Html.Editor 帮手，你也可以指定htmlFiledName如果手动你想要的。
Then inside the MyUserControl.ascx (placed in ~/Views/Shared/EditorTemplates) you can use ViewData.TemplateInfo.HtmlFieldPrefix property to access the parent control ID or Html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldId("MyPostfixPart") to generate prefixed id. Theese methods could be used in the helper extension above.
The same works with controls rendered with Html.Editor(...) and Html.EditorForModel(...). In the Html.Editor helper you can also specify htmlFiledName manually if you want.
当您嵌入与对照
<%= Html.Partial("UserControl", Model.User) %>
代meaningfull ID的更难，因为Html.Partial不会提供有关preFIX信息 - 在 ViewData.TemplateInfo.HtmlField preFIX 将总是空的。那么，唯一的解决办法是手工传递preFIX到ASCX控制为重点的ViewData由于这是不优雅的解决方案为previous之一。一个模型字段
generation of meaningfull IDs is harder because the Html.Partial will not provide information about the prefix - the ViewData.TemplateInfo.HtmlFieldPrefix will be always empty. Then, the only solution would be to pass the prefix manually to the ascx control in as ViewData key of as a model field which is not as elegant a solution as the previous one.
这篇关于单选按钮生成HTML重复ID-S的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
