如何通過bootstrap-switch.js綁定調用knockout函數？

我試圖表現出在表中我的數據，但不是複選框顯示看中的東西像 http://www.bootstrap-switch.org/如何通過bootstrap-switch.js綁定調用knockout函數？

我已經成功地建立我的表，並使用此綁定

ko.bindingHandlers.bootstrapSwitchOn = { 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     $elem = $(element); 
     $(element).bootstrapSwitch(); 
     $(element).bootstrapSwitch('state', ko.utils.unwrapObservable(valueAccessor())); // Set intial state 
     $elem.on('switchChange.bootstrapSwitch', function (e, data) { 
      valueAccessor()(data); 
      //$(this).trigger('click'); --***-- 
     }); // Update the model when changed. 
    }, 
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     var vStatus = $(element).bootstrapSwitch('state'); 
     var vmStatus = ko.utils.unwrapObservable(valueAccessor()); 
     if (vStatus != vmStatus) { 
      $(element).bootstrapSwitch('state', vmStatus); 
     } 
    } 
};

我處理插件已經顯示了數據，但我陷入了下一個階段。每次用戶點擊交換機時，我想調用一個方法來更改數據庫中數據的狀態。這是我試過的

<input type="checkbox" data-on-color="success" data-on-text="on" data-off-text="off" data-off-color="danger" name="switch-checkbox" 
      data-bind="bootstrapSwitchOn: active, click: $root.updateData"></td>

但是該方法從未被調用。據我瞭解這是因爲bootstrap-switch.js實際上並沒有觸發它。所以我試圖自己做 - * - 在自定義綁定。這導致了2次觸發事件。這是不可接受的。

有沒有什麼辦法可以在淘汰賽中調用這個方法，但不改變虛擬機？我知道我可以使用dummyObservable並在綁定中進行更新，但如果必須更改每個要使用bootstrap-switch的虛擬機，自定義綁定的意義何在？

基本上我試圖讓東西可重用，並卡在淘汰賽的一部分。

來源

2014-08-29 Icepick

我找到了我的問題的解決方案。最後我去了另一條路，並要求我從VM直接在我的bindinng所需的功能

ko.bindingHandlers.bootstrapSwitchOn = { 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     $elem = $(element); 
     $elem.bootstrapSwitch(); 
     $elem.bootstrapSwitch('state', ko.utils.unwrapObservable(valueAccessor().state())); // Set intial state 
     $elem.on('switchChange.bootstrapSwitch', function (e, data) { 
      var context = ko.contextFor(this); 
      context.$root[valueAccessor().fnctn](context.$data); 
     }); 
    } 
};

我的HTML現在看起來不同，因爲我想盡可能通用，所以我傳遞參數綁定知道要調用哪個VM功能。

<input type="checkbox" data-on-color="success" data-on-text="on" data-off-text="off" data-off-color="danger" name="switch-checkbox" 
     data-bind="bootstrapSwitchOn: {state: active, fnctn: 'updateData' }"></td>

來源

2014-09-04 12:01:37 Icepick

如何通過bootstrap-switch.js綁定調用knockout函數？

回答

相關問題