Подтвердить что ты не робот

Нокаут js переключатель кнопка событие reset выбор

У меня есть привязка "checked" и "click" в списке радиокнопок. Но всякий раз, когда щелкает радиокнопку, выбор не остается. Я должен делать что-то действительно не так. Очень ценю, если вы, ребята, можете указать мне в правильном направлении.

Смотрите Fiddle Here

Просмотр модели:

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),

    click: function(model){
        console.log(model);
    }
};

Вид:

<input type="radio" name="flavorGroup" value="cherry" 
       data-bind="checked: spamFlavor, click:click" />
4b9b3361

Ответ 1

В документации click:

По умолчанию нокаут предотвратит событие click от любого действия по умолчанию.
...
Однако, если вы хотите, чтобы действие по умолчанию click продолжалось, просто return true от вашей функции обработчика кликов.

Итак, ваш переключатель reset из-за вашего обработчика click, и для его исправления вам просто нужно return true в конце:

click: function(){
   alert('Hi');
   return true;
}

Демо JSFiddle.

Ответ 2

В принципе, ваш обработчик кликов не сможет поймать, что вы хотите сохранить значение.

Что происходит, так это то, что после выбора элемента он возвращается к умолчанию.

Просто попробуйте:

return true;

Как единственный код в вашем handler.

Отвлечься: http://jsfiddle.net/SinisterSystems/jhHkD/4/

Ответ 3

Вы просто удаляете событие click или используете return true из события click. Поскольку Knockout не позволяет событию клика принимать какое-либо действие по умолчанию. Это означает, что если вы используете привязку кликов к тегу (ссылку), например, браузер будет вызывать только функцию вашего обработчика и не будет перемещаться по ссылкам href

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),
    /*click: function(){
      alert('Hi');
    }*/
};

или

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),
    click: function(){
      alert('Hi');
      return true;
    }
};