2012-03-28 13 views
1

こんにちは、stackoverflowコミュニティに伝えたいと思います。jqueryでフィールドを更新するとobservableが更新されない

私はちょうど数日前にノックアウトを使い始めました。

私が取り組んでいるCMSのための動的なメニュービルダーを作るために、私はそれを使っています。 http://jsfiddle.net/dnlgmzddr/HcRqn/

問題は、私は選択ボックスから要素を選択すると、私は期待して入力フィールドの更新が、観察可能な変更を反映していないということである。ここでは

はコードです。そのため、追加ボタンは有効になっていません。

私には何が欠けていますか?どうすれば修正できますか?

ありがとうございます。

答えて

8

あなたはURLフィールドを移入すると、あなたは、観察をupatedするために得るために変更イベントをトリガする必要があります:次のように。だから、あなたは何ができる:

$("#url").val('/pages/' + id).change(); 

別のオプションをそれがノックアウト精神でより多くのですが、あなたの選択に結合を使用することです。この場合、オブザーバブルにその値を設定し、手動サブスクリプションを使用して、フォーマットされた値を入力フィールドにデフォルト設定することが考えられます。

その後
this.itemUrl = ko.observable(); 
this.selectedUrl = ko.observable(); 
this.selectedUrl.subscribe(function(newValue) { 
    if (newValue) { 
     this.itemUrl("/pages/" + newValue);     
    } 
}, this); 

selectedUrlにあなたの選択をバインドします。ここでは

<select id="pagedList" data-bind="value: selectedUrl"> 
     <option value=""><option> 
     <option value="test">Test</option> 
    </select> 

はサンプルです:http://jsfiddle.net/rniemeyer/HcRqn/21/

あなたのオプションの「値」場合にも、余分な観測可能とマニュアルサブスクリプションを排除することができますurlだった。

1

フィールドが選択されているときに実際にボタンを有効にしているコードのどこにも表示されません。だから私は何かが欠けているかもしれませんが、ただボタンを変更するだけです。

function LoadMenu() { 
    $("#pagedList").change(function() { 
     var id = $(this).val(); 
     $("#url").val('/pages/' + id); 
     // remove the disabled attribute here 
     $('button.space').removeAttr('disabled'); 
    }); 
} 
関連する問題