Невозможно применить метод.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 на втором.

Другие вопросы по тегам