JQuery Select Populate

Question

i have to items on my html

a Input text (company) field and a select (Company_List)

when user types in the text field i want jQuery to use /Home/SearchSynonym/ to get the names and display it in select (the SearchSynonym takes the value user types and do a wildcard search and returns ID and NAME )

can some one help , am new ti jQuery

Leb

Answer 1

You need to clarify as to in which format does SearchSynonym return the IDs and NAMEs? Is it in JSON? If it is in JSON, then try the following:

var companyList = $("#Company_List");

$("#company").change( function(){
    $.getJSON("/Home/SearchSynonym/",{ query: $(this).val() }, function(response){
        var responseList = "";
        $.each(result, function(index, item){
            responseList += "<option value='" + item.id + "'>" + item.name + "</option>";
        });
        companyList.html(responseList);
    });
});    

This would work if your 'company' text field bears the id="company" in the tag decleration, your 'Company_List' dropdown bears the id="Company_List" in the tag decleration and your server end receives the parameter "query" for pulling records.

Answer 2

You can use setTimeout. Try this:

var companyList = $("#Company_List");

$("#company").change( function(){
    setTimeout( function() {
        $.getJSON("/Home/SearchSynonym/",{ query: $(this).val() }, function(response){
            var responseList = "";
            $.each(result, function(index, item){
                responseList += "<option value='" + item.id + "'>" + item.name + "</option>";
            });
            companyList.html(responseList);
        });
    }, 2000);    
});

The value of 2000 indicates a 2 second delay.