jquery - How can i make the new html 5 datalist input open ‎immediately? -


question hard understand , english not native language, i'll best. new html tag <datalist> allows me create input field dropdown menu (actually not sure how call it).

the first time page loaded there only:

<input list='chemikalienliste' class="input_search" /> <datalist id='chemikalienliste'></datalist> <a href="#" class="add_button">+</a> 

as result there no dropdown menu when first click it. (thats good!) when user typing sign input field generates few <option> tags, buuuut not drop menu. have type second sign first.

for(var = 0; < data.length; i++){     suchergebnis = suchergebnis+ "<option value='"+data[i].trvialname+" ("+data[i].chemischername+")"+"' />";    }            input_search.parent(".add").children("#chemikalienliste").children("option").remove(); //deletes options input_search.parent(".add").children("#chemikalienliste").append(suchergebnis);//adds new options 

the entire code

$(".input_search").focus().keyup(function(){ //user types     var input_search = $(this);     var searchstring = input_search.val();     $.ajax({         url:"api.php",         data:"search="+searchstring,         type:"post",         datatype:"json",         success: function(data){ //recieve data             var suchergebnis = "";             for(var = 0; < data.length; i++){                 suchergebnis = suchergebnis+ "<option value='"+data[i].trvialname+" ("+data[i].chemischername+")"+"' />";                }                        input_search.parent(".add").children("#chemikalienliste").children("option").remove();             input_search.parent(".add").children("#chemikalienliste").append(suchergebnis);             input_search.focus();         },          error: function (xmlhttprequest, textstatus, errorthrown) {         $("#output").append("<span class='message'>[ajax]</span> <span class='failed'>error:</span> xmlhttprequest " + xmlhttprequest[0] + " errorthrown: " + errorthrown +" textstatus : " +                                                                                                textstatus+" <br />");              }     }); }); 

sorry language... hope @ least can understand problem is.

if there other options create google search input field, please tell me

since arleady using jquery think should use jquery ui autocomplete. datalist not made support dynamic options (but work can it). can read more here: http://devproconnections.com/html5/working-html5-web-forms-autocompletion-and-datalist-element


Comments

Popular posts from this blog

rest - Spring boot: Request method 'PUT' not supported -

php - Magento - Deleted Base url key -

symfony - imagine_filter() not generating the correct url in LiipImagineBundle -