如何将标签与单选button相关联
我正在使用MVC,我有一个简单的单选button设置:
<%=Html.RadioButton("my_flag", True)%><label>Yes</label> <%=Html.RadioButton("my_flag", False)%><label>No</label>
我唯一遗漏的是你不能点击标签来select单选button。 通常你会使用:
<label for="my_flag">
但是将这两个标签与最后一个单选button相关联。 有什么办法将标签与正确的单选button相关联吗?
注意:这是模仿纸张forms,所以切换到checkbox不是一个选项。
您需要给两个单选button命名 (以便它们在同一组中),但是不同的ID (以便您可以将标签与每个单独关联)。 我不熟悉ASP.NET MVC,所以我不知道如何实现这一点,但这是解决scheme。
编辑:第二种可能性是将单选button包裹在标签标签内,如下所示:
<label><%=Html.RadioButton("my_flag", True)%>Yes</label> <label><%=Html.RadioButton("my_flag", False)%>No</label>
*请注意,这种方式可能实际上有更好的浏览器兼容性,我知道一些浏览器仍然如果名称/ ID的区别
你有两种不同的方式来实现这一点。
第一个简单的解决scheme是将单选buttonembedded到<label/>
标签中。
<p> <label><%=Html.RadioButton("option", "yes") %> Yes</label> </p> <p> <label><%=Html.RadioButton("option", "no") %> No</label> </p>
第二个path是将每个单选button与一个ID相关联。 对于htmlAttributes
参数来说,这也很简单,它允许在表单布局方面有更多的灵活性:
<p> <label for="option_yes">Yes:</label> <%=Html.RadioButton("option", "yes", new { id = "option_yes" }) %> </p> <p> <label for="option_no">Np:</label> <%=Html.RadioButton("option", "no", new { id = "option_no" }) %> </p>
我会推荐后者,而且似乎也是你所要求的。
编辑
事实上,无论如何,你都应该给ID参数一个参数。 如果您不这样做,您的网站将具有多个具有相同ID的元素,并且这未通过HTMLvalidation。
我不是一个asp程序员,所以对不起,我会告诉一些事情:P
标签的属性被引用到input的id。 所以你将不得不做类似的事情
<input type="radio" name="rad1" id="rad1_1"><label for="rad1_1">Rad1</label> <input type="radio" name="rad1" id="rad1_2"><label for="rad1_2">Rad2</label>
你可以这样做:(这是使用剃刀,但很容易翻译。)
@Html.RadioButtonFor(model => model.MyValue, true, new { id = "MyValue_True" }) <label for="MyValue_True">Yes, this is true</label> @Html.RadioButtonFor(model => model.MyValue, false, new { id = "MyValue_False" }) <label for="MyValue_False">No, this is false</label>
基本上你手动指定单选button的id
属性。