bootstrap-switch.js 바인딩을 사용하여 녹아웃 기능을 호출하는 방법은 무엇입니까?

Question

나는 테이블에 내 데이터를 표시하기 위해 노력하고있어 대신 http://www.bootstrap-switch.org/

같은 화려한 체크 박스 쇼 뭔가 내 테이블을 구축하고이 바인딩

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); 
     } 
    } 
}; 

I을 사용하여 플러그인을 처리하기 위해 관리했습니다 데이터를 보여 줬지만 다음 단계에 머물러 있습니다. 사용자가 스위치를 클릭 할 때마다 DB에서 내 데이터의 상태를 변경하는 메소드를 호출하려고합니다. 이것이 내가 시도한 것입니다.

<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> 

그러나 The 메서드는 호출되지 않습니다. bootstrap-switch.js가 실제로 그것을 트리거하지 않기 때문입니다. 그래서 나 자신을 해보려고 - * - 사용자 지정 바인딩에. 이로 인해 이벤트가 2 번 트리거되었습니다. 어느 쪽이 받아 들여지지 않습니다.

녹아웃에서이 방법을 호출 할 수 있지만 VM을 변경하지 않은 방법이 있습니까? dummyObservable을 사용하여 바인딩에서 업데이트 할 수 있지만 부트 스트랩 스위치를 사용하려는 모든 VM을 변경해야하는 경우 사용자 지정 바인딩의 요점은 무엇입니까?

기본적으로 나는 재사용이 가능한 부분을 만들고 노크 아웃 부분에 집착하고 있습니다.

Answer 1

문제점에 대한 해결책을 찾았습니다. 마지막에 나는 다른 길을 가서 내가 직접 내 bindinng에 VM에서 필요한 함수를 호출

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>