Ankur Dhanuka
Ankur Dhanuka

Reputation: 1237

manage city according to country selected in jquery autocomplete?

//for country

var objCountries = [];
var objSearchCountry = new Object();
objSearchCountry.CountryName = $("#txtCountry").val();
$.ajax({
    type: "POST",
    url: "db.php?GetCountryList",
    data: {data:[]},
    dataType: "json",
    async:false,
    success: function(response)
    {
        if(response.IsError)
            alert(response.ErrorMessage);
        else
            objCountries = response;
    },
    error:function(response)
    {
        alert("Error: " + response.responseText);
    }
});

var newObjCountry = [];
for (var indexCountry in objCountries)
    newObjCountry.push(objCountries[indexCountry].CountryName);
$("#txtCountry").autocomplete({ source: newObjCountry });

when i select any country, i want its id so that i can pass this id, in city to get related cities.

$("#txtCountry").blur(function()
{
//for city
var objCities = [];
var objSearch = new Object();
objSearch.city_name = $("#txtCity").val();
$.ajax({
    type: "POST",
    url: "db.php?GetCityList",
    data: {data:[]},
    dataType: "json",
    async:false,
    success: function(response)
    {
        if(response.IsError)
            alert(response.ErrorMessage);
        else
            objCities = response;
    },
    error:function(response)
    {
        alert("Error: " + response.responseText);
    }
});

var newObj = [];
for (var index in objCities)
    newObj.push(objCities[index].city_name);
$("#txtCity").autocomplete({ source: newObj });
});

Thanks

Upvotes: 1

Views: 407

Answers (1)

Vinod Louis
Vinod Louis

Reputation: 4876

what you need is to use on select event of autocomplete

Here is Working Demo

 select : function(e, ui){
     alert("selected!" + ui.item.value);
     //rest of the code after selection goes here
 }

Upvotes: 1

Related Questions