$('document').ready(function()
    {

        $('#city_id').change(updateCityOptions);
        $('#area_id').change(updateAreaOptions);
        $('#type_id').change(updateRentalOptions);
    });
function updateRentalOptions(){

    var cityIndex=document.form.city_id.selectedIndex;
    var typeIndex=document.form.type_id.selectedIndex;
    var areaIndex=document.form.area_id.selectedIndex;


    if(cityIndex==0 || areaIndex==0 || typeIndex==0)
       return;

    var progressbar=document.getElementById("progress");
    progressbar.style.visibility="visible";
    $.getJSON('/filters/rentalSearch.php',{
        area:$('#area_id').val(),
        city:$('#city_id').val(),
        rental:$('#type_id').val()
    }, function(data) {


        // update the options in bedrooms drop down list
        var roomsDropDown=document.form.bedrooms;
        roomsDropDown.disabled=false;
        roomsDropDown.options.length=0;
        var opt = roomsDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.rooms.length;i++)
        {
           var opt = roomsDropDown.options;
           opt[opt.length] = new Option(data.rooms[i],data.rooms[i]);    
        }

        // as now searching is complete hide the progress bar
        progressbar.style.visibility= "hidden";
    });
}
function updateAreaOptions()
{
    var cityIndex=document.form.city_id.selectedIndex;

    var areaIndex=document.form.area_id.selectedIndex;


    if(cityIndex==0 || areaIndex==0)
       return;


    //make the progress bar visible while the searching is going on
    var progressbar=document.getElementById("progress");

    progressbar.style.visibility="visible";
    $.getJSON('/filters/areaSearch.php',{
        area:$('#area_id').val()
    }, function(data) {

        // update the options in rental drop down list
        var rentalDropDown=document.form.type_id;
        rentalDropDown.disabled=false;
        rentalDropDown.options.length=0;
        var opt = rentalDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.rental.length;i++)
        {
              var opt = rentalDropDown.options;
              opt[opt.length] = new Option(data.rental[i].value,data.rental[i].key);    
        }

        // update the options in bedrooms drop down list
        var roomsDropDown=document.form.bedrooms;
        roomsDropDown.disabled=false;
        roomsDropDown.options.length=0;
        var opt = roomsDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.rooms.length;i++)
        {
              var opt = roomsDropDown.options;
              opt[opt.length] = new Option(data.rooms[i],data.rooms[i]);    
        }
        // as now searching is complete hide the progress bar
        progressbar.style.visibility= "hidden";
    });
}
function updateCityOptions()
{
    var cityIndex=document.form.city_id.selectedIndex;
    if(cityIndex==0)
       return;


    //make the progress bar visible while the searching is going on
    var progressbar=document.getElementById("progress");
    progressbar.style.visibility="visible";

    //alert("updating city--"+$('#city_id').val());
    //retrieve the data in the form of json from the server side script
    $.getJSON('/filters/citySearch.php',{
        city:$('#city_id').val()
    }, function(data) {
//alert("got data:"+data.area.length);
        // update the options in area drop down list
        var areaDropDown=document.form.area_id;
        areaDropDown.disabled=false;
        areaDropDown.options.length=0;

        var opt = areaDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.area.length;i++)
        {
             var opt = areaDropDown.options;
             opt[opt.length] = new Option(data.area[i].value,data.area[i].key);

        }

        areaDropDown.selected=1;
        // update the options in rental drop down list
        var rentalDropDown=document.form.type_id;
        rentalDropDown.disabled=false;
        rentalDropDown.options.length=0;
        var opt = rentalDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.rental.length;i++)
        {
            
            var opt = rentalDropDown.options;
            opt[opt.length] = new Option(data.rental[i].value,data.rental[i].key);        
        }

        // update the options in bedrooms drop down list
        var roomsDropDown=document.form.bedrooms;
        roomsDropDown.disabled=false;
        roomsDropDown.options.length=0;
        var opt = roomsDropDown.options;
        opt[opt.length] = new Option("All","");
        for(var i=0;i<data.rooms.length;i++)
        {
            var opt = roomsDropDown.options;
            opt[opt.length] = new Option(data.rooms[i],data.rooms[i]);        
        }
        // as now searching is complete hide the progress bar
        progressbar.style.visibility= "hidden";

    });


}