Я пытаюсь заменить флажок в таблице с этим красивымПереключатель начальной загрузки. Я

м также с использованием нокаута и обработчика привязки, как это предлагаетсяссылка на сайт.

Однако я не могу заставить обработчик привязки работать и / или переключение, чтобы можно было щелкать мышью в таблице, построенной с использованием нокаута для каждого.

мы повторили проблему вjsfiddle.I»

Я все еще изучаю JavaScript и нокаут и не могу понять, чтопроисходит ошибка в обработчике привязки или переключателе.

Есть идеи?

HTML:

    <span data-bind="text: on() ? 'on' : 'off'"></span>


    


<p>Why doesn't this work in a table?</p>


    
    
        Name
        Old
        Old toggle With CheckBox
        Old toggle With Switch
    
    
    
        
            
            
            
                
            
            
                
                    
                
            
        
    

Обязательный обработчик и вид нокаута

/**
 * Knockout binding handler for bootstrapSwitch indicating the status
 * of the switch (on/off): https://github.com/nostalgiaz/bootstrap-switch
 */
ko.bindingHandlers.bootstrapSwitchOn = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        $elem = $(element);
        $(element).bootstrapSwitch('setState', ko.utils.unwrapObservable(valueAccessor())); // Set intial state
        $elem.on('switch-change', function (e, data) {
            valueAccessor()(data.value);
        }); // Update the model when changed.
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var vStatus = $(element).bootstrapSwitch('status');
        var vmStatus = ko.utils.unwrapObservable(valueAccessor());
        if (vStatus != vmStatus) {
            $(element).bootstrapSwitch('setState', vmStatus);
        }
    }
};

var vm = {
    on: ko.observable(true),

    items: ko.observableArray([
        {Name: "Dave", Old: ko.observable(false)},
        {Name: "Richard", Old: ko.observable(true)},
        {Name: "John", Old: ko.observable(false)}
    ])    
}

ko.applyBindings(vm);