JSFiddle - React, Tailwind, and code Playground
by simucal
HTML
<input type="text" id="symbols" />
<button id="search">Search</button>
JavaScript
/*
* jQuery UI Autocomplete HTML Extension
* http://github.com/scottgonzalez/jquery-ui-extensions
*/
(function($) {
var proto = $.ui.autocomplete.prototype,
initSource = proto._initSource;
function filter(array, term) {
var matcher = new RegExp($.ui.autocomplete.escapeRegex(term), "i");
return $.grep(array, function(value) {
return matcher.test($("<div>").html(value.label || value.value || value).text());
});
}
$.extend(proto, {
_initSource: function() {
if (this.options.html && $.isArray(this.options.source)) {
this.source = function(request, response) {
response(filter(this.options.source, request.term));
};
} else {
initSource.call(this);
}
},
_renderItem: function(ul, item) {
return $("<li></li>").data("item.autocomplete", item).append($("<a></a>")[this.options.html ? "html" : "text"](item.label)).appendTo(ul);
}
});
})(jQuery);
/**
* Stock Symbol Suggest - jQuery UI Plugin
*
*/
(function($) {
$.widget("ui.symbolsuggest", {
options: {
source: "https://symbollookupsvcext.scottrade.com/SecuritiesService/SecuritiesService.svc/security/{0}?callback=?",
delay: 100,
mulitple: false,
search: undefined
},
_create: function() {
var self = this,
o = self.options,
$el = self.element;
if (o.multiple) {
$el.bind("keydown", function(event) {
// Prevent navigating away from the field on tab when selecting an item
if (event.keyCode === 9 &&
$(this).data("autocomplete").menu.active) {
event.preventDefault();
}
});
}
$el.autocomplete({
source:...