jquery disable/remove option on select?
- by SoulieBaby
Hi all, I have two select lists, I would like jquery to either remove or disable a select option, depending on what is selected from the first select list:
<select name="booking" id="booking">
<option value="3">Group Bookings</option>
<option value="2" selected="selected">Port Phillip Bay Snapper Charters</option>
<option value="6">Portland Tuna Fishing</option>
<option value="1">Sport Fishing</option>
</select>
Here's the second list (which will only ever have two values):
<select name="charterType" id="charterType">
<option value="1">Individual Booking</option>
<option value="2">Group Booking</option>
</select>
If Group Bookings or Port Phillip Bay Snapper Charters are selected, I need only "Group Booking" to be displayed. (To basically hide "Individual Booking") but I can't seem to get it to work.. If someone could help me that'd be great!! :)
I've also tried using a switch, but that doesnt work either..
/* select list */
switch (jQuery('#booking :selected').text()) {
case 'Sport Fishing':
alert('AA');
break;
case 'Port Phillip Bay Snapper Charters':
jQuery("#charterType option[value=1]").remove();
alert('BB');
break;
case 'Portland Tuna Fishing':
alert('CC');
break;
case 'Group Bookings':
alert('DD');
break;
};
It alerts, but doesn't do anything else..
