Невозможно применить метод.buttonset() jQuery к сгенерированным Razor RadioButtons
Я хотел бы применить метод buttonset() jQuery к radioButtons. Итак, я написал:
<div id="divSomething">
<input type="radio" id="radio1" name="HasSomething" value="Yes" ><label for="radio1">Yes</label>
<input type="radio" id="radio2" name="HasSomething" value="No"><label for="radio2">No</label>
<input type="radio" id="radio3" name="HasSomething" value="Dont mind" checked="checked"><label for="radio3">Don't mind</label>
</div>
<script type="text/javascript">
$("#divSomething").buttonset();
$("#divSomething input").change(function () {
alert(this.value);
});
</script>
... и это прекрасно работает!
Но это проект ASP.NET MVC3, и я хотел бы использовать синтаксис Razor для генерации своих радио-кнопок. Итак, я написал:
<div id="divSomething">
@Html.RadioButtonFor(m => m.HasSomething, "Yes", new { @type="radio", @id="radio1"})
@Html.RadioButtonFor(m => m.HasSomething, "no", new { @type = "radio", @id = "radio2" })
@Html.RadioButtonFor(m => m.HasSomething, "Dont know", new { @type = "radio", @id = "radio3", @checked = "checked" })
</div>
<script type="text/javascript">
$("#divSomething input").buttonset();
$("#divSomething").change(function () {
alert(this.value);
});
</script>
... и кнопки отображаются как "обычные" радиокнопки, а не в "стиле кнопок". Если бы я только написал $("#divSomething"). Buttonset(); радио кнопки даже не отображаются...
Хуже всего то, что сгенерированный HTML для radioButtons одинаков для обоих методов, за исключением порядка параметров radioButtons (id, value и т. Д.), Но, думаю, это не имеет значения.
Есть что-то настолько очевидное, что я этого не вижу?
Спасибо за помощь.
2 ответа
Итак, вот решение: я должен был добавить метки к сгенерированным RadioButtons
@Html.RadioButtonFor(m => m.HasSomething, "Yes", new { @id="radio1"})
<label for="radio1">Yes</label>
@Html.RadioButtonFor(m => m.HasSomething, "No", new { @id = "radio2" })
<label for="radio2">No</label>
@Html.RadioButtonFor(m => m.HasSomething, "Dont know", new { @id = "radio3", @checked = "checked" })
<label for="radio3">Don't know</label>
В вашем скрипте у вас #divSomething на первом, а #divSomething на втором.