javascript - Ajax autocomplete does not hide (not relevant) elements -
hello use autocomplete ajax. show me options fill out input field , highlight input. script not hide variables not match input anymore.
for example: autocomplete variables (test, tast, testes) if type "tes" see still three, "tast" hidden. because have in autocomplete field countries world.
can give advice why script not hide elements not match input?
i use following code:
js:
<script type="text/javascript" src="js/jquery.autocomplete.js"></script> // insert in html $(function() { $( "#country" ).autocomplete({ type: "post", autofocus: true, datatype: "json", lookuplimit: 5, serviceurl: "profil/countries_form", onselect: function(suggestion) { $('#country').val(suggestion.value); $('#country_iso').val(suggestion.iso); } }); });
result source:
{ "suggestions": [ { "iso": "af", "value": "afghanistan" }, { "iso": "ax", "value": "Ă…land islands" }, { "iso": "al", "value": "albania" }, { "iso": "dz", "value": "algeria" }, { "iso": "as", "value": "american samoa" }, { "iso": "ad", "value": "andorra" }, { "iso": "ao", "value": "angola" }, { "iso": "ai", "value": "anguilla" }, { "iso": "aq", "value": "antarctica" }, { "iso": "ag", "value": "antigua , barbuda" }, ................
html:
<input class="form-control" required="required" id="country" name="country" type="text" autocomplete="off">
css:
/*autocomplete*/ .autocomplete-suggestions { border: 1px solid #999; background: #fff; overflow: auto; } .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; } .autocomplete-selected { background: #f0f0f0; } .autocomplete-suggestions strong { font-weight: normal; color: #3399ff; } .autocomplete-group { padding: 2px 5px; } .autocomplete-group strong { display: block; border-bottom: 1px solid #000; }
thank lot!
best, fabian
Comments
Post a Comment