Knockout-Eingabe-Bindung

Question

Ich versuche, eine Anwendung zu aktualisieren, die Knockout früher nicht verwendet hat. Wenige Eingabefelder erhalten Daten vom Server/von der Datenbank, wenn wir die Auswahloption ändern. Jetzt versuche ich einen Bericht basierend auf den gefüllten Eingabefeldern mit Knockout zu erzeugen. Wenn diese Eingabefelder jedoch Daten aus der Datenbank abrufen, werden sie auf der Benutzeroberfläche nicht aktualisiert. Zum Beispiel

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

erhält Daten aus der Datenbank.

In dem Bericht versuche ich den Wert aus der Datenbank zu aktualisieren.

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

Ansicht Modell:

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

Die Funktion, die Daten aus der Datenbank zum Abrufen separat geschrieben mit Hilfe von JavaScript, Ajax, PHP, xmlhttp.

Wenn ich jetzt die Auswahloption ändere, werden die Eingabefelder aktualisiert, aber im Bericht werden die Daten nicht aktualisiert.

Answer 1

so klingt es wie knockout ist nicht bewusst, dass Ihre Elemente geändert haben. können Sie eine Änderung über jquery erzwingen, nachdem sich Ihre Eingaben von Ihrem ungebundenen Ereignis geändert haben.

Hier ist eine Fiddle, die ich gemacht habe, wo ich einen ungebundenen Knopf Klick habe, der den Wert eines gebundenen Eingabefeldes ändert. https://jsfiddle.net/othkss9s/30/

hier ist die 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(); 
    }); 

}); 

hier ist die 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>