ノックアウトとトグルスイッチ - データバインド

Question

私はjavascriptからKnockoutに切り替えています。私のページでは、BootStrapトグルスイッチを使用しています。

http://www.bootstraptoggle.com/

前に、私はこのようなスイッチの値に基づいて、目に見えるようにDIVを設定します：

if($("#HasPromotion").bootstrapSwitch('state') == false) 
{ 
    $("#promotiondiv").hide(); 
} 

そして、私のコントロールは次のように定義された：

@Html.CheckBoxFor(x => x.HasPromotion, new { @class = "toggleswitchcontrol", data_on_text = "Yes", data_off_text = "No" }) 

付きノックアウト、私は私のviewmodel上のプロパティに値をdatabindしたい。 ....

<input type="checkbox" class="toggleswitchcontrol" data-on-text="Yes" data-off-text="Nope" data-bind="attr: {state: hasPromotion}" /> 

ない成功私が結合するのに何財産わからない：

は、私はこれをしようとしています。どのようにしてコントロールをビューモデルのそのプロパティにバインドできますか？

Answer 1

申し訳ありませんが、私のコメントのスイッチとは異なるブーストスイッチを使用していたことに気付きませんでした。私はboostraptoggleのためのカスタムバインディングを追加するためにフィドルを更新しました。
http://jsfiddle.net/MBLP9/356/

ここではバインディングです。

ko.bindingHandlers.bootstrapToggleOn = { 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     $elem = $(element); 
     $(element).bootstrapToggle(); 
     if (ko.utils.unwrapObservable(valueAccessor())){ 
      $elem.bootstrapToggle('on') 
     }else{ 
      $elem.bootstrapToggle('off') 
     } 

     $elem.change(function() { 
     if ($(this).prop('checked')){ 
      valueAccessor()(true); 
     }else{ 
      valueAccessor()(false); 
     } 
    }) 

    }, 
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) { 
     var vStatus = $(element).prop('checked'); 
     var vmStatus = ko.utils.unwrapObservable(valueAccessor()); 
     if (vStatus != vmStatus) { 
      $(element).bootstrapToggle('toggle') 
     } 
    } 
};