2011-10-14 20 views
14

私はチェックボックスのセリフを持っていて、選択したものを集めたいと思います。チェックボックスは、DIVの中で、div要素がクリックされたときにチェックボックスが同様にチェックを受ける必要があります。Jqueryで値を変更するとKnockoutJSプロパティが更新されない

var oCheckBox = $($(this).find('.chkSocialMediaItem').get(0)); 
oCheckBox.attr('checked', !$(oCheckBox).attr('checked')); 

選択に私のカウンターを更新しませんので、これはうまく動作しますが、KnockoutJSは、変更をピックアップしていないとアイテム。

変更イベントをトリガーする必要がある箇所があります。しかし、チェックボックスの変更イベントを聞くと、実際にトリガされます。

何か助けていただければ幸いです。 ありがとうございます!

アップデート:私は 'ノックアウト' 解決策を発見した

。私のdivで は、私が「クリック」オフデータバインドを行なったし、その関数でチェック値を変更:

<script type="text/html" id="Template"> 
    <div class="item" data-bind="click: DivClicked"> 
     <input type="checkbox" data-bind="checked: IsASelectedItem" class="chkSocialMediaItem"/> 
    </div> 
</script> 


function SocialMediaSearchItem() {   
      this.IsASelectedItem = ko.observable(); 
      this.DivClicked = function() { 
       this.IsASelectedItem(!this.IsASelectedItem()); 
      }; 
} 

これが唯一の解決策ですか?私は実際には2もJqueryソリューションを参照してください。

答えて

11

checked結合は、clickイベントのみを受信します。手動でクリックイベントをトリガすると、実際のチェック値が設定されたときにボックスの同期が外れることになります。

上記の2番目の例で行ったように、値を設定するための好ましい方法は、ビューモデルの値を更新することです。

ただし、1.3betaを使用している場合は、ko.dataFor APIを使用して要素を対応するデータに簡単に接続できます。それは次のようになります。

var oCheckBox = $('.chkSocialMediaItem'), 
     data = ko.dataFor(oCheckBox[0]); 
     data.selectedItem(!data.selectedItem()); 
+0

クイックレスポンスありがとう!私はベータ月曜日に私が@仕事に戻ったときにチェックします:) –

+0

ああ、それは便利です、どのように 'プロパティ'コントロールがviewModelだけでなくバインドされているか調べる方法はありますか? –

+0

自分自身で 'data-bind'属性を解析してから、データ(' data ['somePropertyName'] ')でプロパティ名を使用する以外に、現在行うべき方法はありません –

12
私は@RPニーマイヤーによって投稿1異なって私のために働いた解決策を見つけたが、私は...同じ問題に遭遇したので、私は、私はそれを投稿します考え出し

ノックアウトバージョン:1.2.1 - (ノックアウト-1.2.1.js)ノックアウトによって縛らチェックボックスをチェックする

$('YourCheckBoxHere').removeAttr('checked'); 
$('YourCheckBoxHere').triggerHandler('click'); 

次私が使用したノックアウトに縛らチェックボックスをオフに

私は、うまくいけば、他のソリューションのdidntの仕事ならば、次の

$('YourCheckBoxHere').attr('checked', 'true'); 
$('YourCheckBoxHere').triggerHandler('click'); 

を使用し、おそらくこれは=)...この問題に約3時間を無駄にします。

関連する問題