2016-11-05 10 views
0

以前Knockoutを使用していないアプリケーションを更新しようとしています。一部の入力フィールドは、selectオプションを変更すると、サーバー/データベースからデータを取得します。今、ノックアウトを使って入力フィールドに基づいてレポートを生成しようとしています。しかし、これらの入力フィールドがデータベースからデータを取得すると、UIで更新されていません。 例えば、ノックアウト入力バインド

<input type = "text" id = "ip1" data-bind = "value:ip1"></input>

データベースからデータを取得します。

レポートでは、データベースから受け取った値を更新しようとしています。

<tr><td>Left Margin:</td><td><strong data-bind="text:ip1"></strong></td></tr>

ビューモデル:

function ViewModel() { 
 
\t \t self = this; 
 
\t \t self.ip1 = ko.observable(); 
 
}; 
 
var vm = new ViewModel(); 
 
ko.applyBindings(vm);

機能データベースからデータを取得するためには、JavaScriptやAjaxを、PHP、XMLHTTPを使用して個別に書かれています。

ここで、選択オプションを変更すると、入力フィールドは更新されますが、レポートではデータは更新されません。

+0

ですか?すべてを動作させるには、 'vm.ip1(newValue)'を使って 'ip1'を設定する必要があります。あなたは、** DOMを介してコードを通じて値を更新しようとしないでください**。 – user3297291

答えて

0

あなたの要素が変更されたことをノックアウトが気にしないように聞こえます。バインドされていないイベントから入力が変更された後、jqueryを使用して強制的に変更することはできますか。

jQuery('#myinput').change(); 

ここで私は、バインドされた入力ボックスの値を変更するボタンのクリックを解除したところで行いました。 https://jsfiddle.net/othkss9s/30/

は、ここでは、ここではJavaScript

function model() { 
    var self = this; 
    this.test = ko.observable("test"); 
}; 

var myViewModel = new model(); 

$(document).ready(function() { 
    ko.applyBindings(myViewModel); 
    $('#mybutton').click(function(event) { 
    $('#myinput').val('changed from jquery'); 
    jQuery('#myinput').change(); 
    }); 

}); 

はどのようにサーバーから新しいデータを処理しているHTML

<p> 
    <input data-bind="textInput: test" id="myinput"> the value is: 
    <label data-bind="text: test"></label> 
</p> 

<p> 
    <button id="mybutton"> 
    change the value using jquery 
    </button> 
</p> 
関連する問題