CODEWITHSUNDEEP
javascriptajaxjquery
Domas
Domas

Reputation: 1133

Setting an AJAX call and filling dropdown

So here I have two dropdowns:

<select id="CountryId">
<option value="16">UK</option>
<option value="17">Germany</option>
<option value="18">Italy</option>
<option value="19">Spain</option>
</select>


<select id="CityId"> </select>

And in the app I have a php function which returns a list of cities by the country's ID:

{"63":"Rome","65":"Palermo","72":"Torino","73":"Milan"}

What I try to achieve is onChange of the first dropdown to take the country's ID and populate the second list with the returned cities.

I try to achieve it with this AJAX call, and tried to debug it, but nothing seems to work. The var data is being picked up, but nothing else happens. Here is the snippet:

$('#CountryId').change(function(){
     var data = $('#EventCustomerId option:selected').val();

     $.ajax({
         type:'POST',
         async: true,
         cache: false,
         url: <?php echo Router::url(array('controller'=>'projects','action'=>'getbycustomer')) ?>,
         success: function(response) {
             jQuery('#CityId').html(response);
         },
         data: data
     });
     return false;
})

I am not quite secure about the way of filling the second dropdown with the response. The response is returned in plain HTML in JSON.

Any help is much much appreciated.

Upvotes: 1

Views: 406

Answers (1)

Jasper Van Kerschaver
Jasper Van Kerschaver

Reputation: 81

have you tried with putting async to false?

    $('#CountryId').change(function(){
         var data = $('#EventCustomerId option:selected').val();
         $.ajax({
             type:'POST',
             async: false,
             cache: false,
             url: <?php echo  Router::url(array('controller'=>'projects','action'=>'getbycustomer')) ?>,
             success: function(response) {
                 jQuery('#CityId').html(response);
             },
             data: data
         });
    });

can you post your response here if the call should work now

Upvotes: 1

Related Questions