Отмена выбора радиокнопок при сохранении синхронизации модели просмотра - PullRequest
Новая
       12

Отмена выбора радиокнопок при сохранении синхронизации модели просмотра

2 голосов
/ 15 сентября 2011

У меня есть радиогруппа, которая позволяет пользователю (используя события jQuery) отменить выбор предыдущих выборов.Я пытаюсь добавить KnockoutJS для отслеживания изменений, но viewmodal не синхронизируется с пользовательским интерфейсом.Кто-нибудь может подсказать, как я могу заставить их синхронизироваться?

Мой код просмотра: 

<div id='test'>
    <input data-bind="checked: asd"  name='asd' type='radio' value="a"/>
    <input data-bind="checked: asd"  name='asd' type='radio' value="b"/>
    <input data-bind="checked: asd"  name='asd' type='radio' value="c"/>
</div>
<div>
     <p>Linked Value: <span data-bind="text: asd"></p>  
</div>

Соответствующий JS: 

$('#test input[type="radio"]').click(function (event) {
    var checked = $(this).hasClass('checked');
    if (checked) {
        $(this).removeAttr('checked');
        $(this).removeClass('checked');
    }
    else {
        $(this).addClass('checked');
    }
});

var viewModel = {
  asd: ko.observable("a")
};

ko.applyBindings(viewModel);

Пример можно посмотретьздесь онлайн в этой скрипке .

Ответы [ 2 ]

1 голос
/ 15 сентября 2011

Я думаю, что простым способом было бы сделать: 

$('#test input[type="radio"]').click(function (event) {
    if ($(this).val() === viewModel.asd()) {
         viewModel.asd(null);   
    }
});

Обновленная скрипка

1 голос
/ 15 сентября 2011

Вам не нужно беспокоиться о проверенном атрибуте, это сделано для вас. Измените ваше событие на это: 

$('#test input[type="radio"]').click(function (event) {

    var checked = $(this).hasClass('checked');
    if (checked) {
        $(this).removeClass('checked');
    }
    else {
        $(this).addClass('checked');
    }
});

Вилка вашей скрипки здесь

...