0

HTML:

<label class="radio-inline">
    <input type="radio" name="admin" value="t" id="adminTrue"> Да
</label>
<label class="radio-inline">
    <input type="radio" name="admin" value="f" id="adminFalse"> Нет
</label>

JavaScript

$('#infoUser').on('show.bs.modal', function (event) {
    var button = $(event.relatedTarget)
    var modal = $(this)
    var admin = button.data('user-admin')

    if (admin == 't') {
        modal.find('input[id="adminTrue"]').attr('checked', 'checked');
    } else {
        modal.find('input[id="adminFalse"]').attr('checked', 'checked');
    }
})
$('#infoUser').on('hide.bs.modal', function (event) {
    var modal = $(this)
    modal.find('input[name="admin"]').removeAttr('checked');
})

Браузеры отображают не правильно выделенные radio, хотя есть анализировать код Firebug, то в DOM все правильно меняется.

Здесь можно посмотреть полный код с примером:
http://codepen.io/ArsenBespalov/full/eNOwRy/

2 ответа 2

1

Проблема первая. У вас переменная admin undefined. Почему? Все из-за вашей невнимательности. У кнопки в примере есть атрибут data-user-id и нет атрибута
data-user-admin, который вы пытаетесь прочитать.

Проблема вторая. Невозможность повторной установки атрибута checked можно побороть следующим образом:

if (admin == 't') {
  modal.find('input[id="adminTrue"]').trigger('click');
} else {
  modal.find('input[id="adminFalse"]').trigger('click');
}

Протестировал несколько раз. С таким подходом выбранная радиокнопка всегда корректно отображается.

0

Устанавливать свойство checked нужно через prop

$().prop('checked', true);

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.