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

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

php - Magento - Deleted Base url key -

android - How to disable Button if EditText is empty ? -