JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/ui-lightness/jquery-ui.css">
<form data-bind="submit: search">
    <input data-bind="value: searchText, valueUpdate:['blur','autocompleteselect'], jqAutocomplete: source" />
    <input type="submit" value="Submit" />
</form>input:
<label data-bind="text: searchText"></label>
<br/>form:
<label data-bind="text: formSubmit"></label>

JavaScript

ko.bindingHandlers.jqAutocomplete = {
    update: function (element, valueAccessor) {
        var value = valueAccessor();

        $(element).autocomplete({
            source: value
        });
    }
};

var ViewModel = function () {
    var self = this;
    self.searchText = ko.observable("");
    self.formSubmit = ko.observable("");

    self.source = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"];

    self.search = function () {
        var text = self.searchText();

        self.formSubmit("Form Submitted: " + text);
    };
};

ko.applyBindings(new ViewModel());