Question

I have two dropdownlist which shows places in my asp.net MVC(C#) application.

The First dropdownlist is to show the “From Place” and the second dropdownlist is to show the “To Place”.

The list of Places are say like :

 Alabama
 Alaska
 California
 Maryland,.....

The From and To Place dropdownlists contains the above places. When i select a place in the From place dropdownlist, the To place dropdownlist should contain the places other than that selected in the From place dropdownlist.

How can i do it using jquery? or any other effective way to do it?

Answer 1

The below code is very useful:

$('#FromPlace').change(function() {
   $('#ToPlace >option').remove();
   var options = '';
   options += '<option value="">' + "--Select Place--" + '</option>';
   $("#FromPlace option").map(function(a, b) {
       b.value != '' && $("#FromPlace option:selected").val() != b.value ? options += '<option value="' + b.value + '">' + b.text + '</option>' : '';
   });
   $("select#ToPlace").html(options);
});