Knockout und jQuery Autocomplete

Question

Knockout Wertbindung funktioniert nicht mit jquery Autocomplte. Wie funktioniert es?

Ich habe eine Vorlage:

<input 
    type="text" 
    class="autocomplete" 
    data-bind="value: viewModelObservableValue" 
    name="MyValue" /> 

Nach Vorlage Rendering ich jQuery Autocomplete an einem Eingang beantrage. Bindung funktioniert nicht. Siehe meine jsfiddle.

Es funktioniert nur, wenn ko.applyBindings(viewModel) geht nach $(..).autocomplete(..);

Answer 1

Es sieht aus wie jQuery Autocomplete die change Ereignis entführt. Deshalb funktioniert es nicht. Um dieses Problem zu beheben, müssen Sie die valueUpdate-Eigenschaft auf blur setzen. Natürlich wird dies nicht ausgelöst, nachdem Sie den Gegenstand ausgewählt haben, müssen Sie zuerst verwischen.

$(function() { 
 
    var availableTags = [ 
 
     "ActionScript", 
 
     "AppleScript", 
 
     "Asp", 
 
     "BASIC", 
 
     "C", 
 
     "C++", 
 
     "Clojure", 
 
     "COBOL", 
 
     "ColdFusion", 
 
     "Scheme" 
 
    ]; 
 
    $(".autocomplete").autocomplete({ 
 
     source: availableTags 
 
    }); 
 
}); 
 

 
var viewModel = { 
 
    myValue: ko.observable() 
 
}; 
 

 
ko.applyBindings(viewModel);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script> 
 

 
<input type="text" class="autocomplete" data-bind="value: myValue, valueUpdate:'blur' " /> 
 

 
<div data-bind="text: myValue"></div>