/ / Knockout i autouzupełnianie jQuery - jquery, jquery-ui, knockout.js, jquery-templates

Knockout i autouzupełnianie jQuery - jquery, jquery-ui, knockout.js, jquery-templates

Wiązanie wartości knockout nie działa z autocomplami jquery. Jak to działa?

Mam szablon:

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

Po renderowaniu szablonu używam autouzupełniania jQuery na danych wejściowych. Wiązanie nie działa. Zobacz moje jsfiddle.

Działa tylko wtedy, gdy ko.applyBindings(viewModel) idzie po $(..).autocomplete(..);

Odpowiedzi:

17 dla odpowiedzi nr 1

Wygląda na to, że autocomplete jQuery przejął kontrolę nad change zdarzenie. To dlatego nie działa.

Aby to naprawić, będziesz musiał ustawić valueUpdate własność do blur. Oczywiście, to nie wyzwolę po wybraniu przedmiotu, będziesz musiał najpierw rozmazać.

$(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>