敲除输入绑定

Question

I am trying to update an application which didn't use Knockout earlier. Few input fields gets data from the server/database as we change the select option. Now, I am trying to generate a report based on the filled input fields using Knockout. But when these input fields get data from database,it is not being updated on the UI. For example,

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

gets data from database.

In the report I am trying to update the value received from database.

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

View Model:

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

The function for retrieving the data from the database is written separately using JavaScript, Ajax, PHP, xmlhttp.

Now when I am changing the select option, the input fields are getting updated but the on the report, the data is not being updated.

Answer 1

so it sounds like knockout is unaware that your elements have changed. can you force a change via jquery after your inputs change from your unbound event.

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

here is a fiddle I did where I have an unbound button click that changes the value of a bound input box. https://jsfiddle.net/othkss9s/30/

here is the 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();
  });

});

here is the 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>