jQuery - Disabling or Removing Options from a Menu -
i working on menu , want options within mutually exclusive. example, if select low importance, high importance should not option, , if select low urgency high urgency should not option either. how can achieve using jquery?
<label>select priority level of task: </label> <select id="taskpriority" name="priority[]" multiple="multiple"> <option value="lowimp">low importance</option> <option value="highimp">high importance</option> <option value="lowurg">low urgency</option> <option value="highurg">high urgency</option> </select>
i've made checks when selection changes: http://jsfiddle.net/ckybj/1/
this th ugliest code i've written, works. can make lot more compact though.
$(document).ready(function () { $('#taskpriority').on('change', function () { var theval = $(this).val(); console.log(theval); if (jquery.inarray('lowimp',theval) > -1) { $('#taskpriority').find('option[value=highimp]').prop('disabled', true); } if (jquery.inarray('highimp',theval) > -1) { $('#taskpriority').find('option[value=lowimp]').prop('disabled', true); } if (jquery.inarray('lowurg',theval) > -1) { $('#taskpriority').find('option[value=highurg]').prop('disabled', true); } if (jquery.inarray('highurg',theval) > -1) { $('#taskpriority').find('option[value=lowurg]').prop('disabled', true); } if(jquery.inarray('lowimp',theval) == -1){ $('#taskpriority').find('option[value=highimp]').prop('disabled',false); } if(jquery.inarray('highimp',theval) == -1){ $('#taskpriority').find('option[value=lowimp]').prop('disabled',false); } if(jquery.inarray('lowurg',theval) == -1){ $('#taskpriority').find('option[value=highurg]').prop('disabled',false); } if(jquery.inarray('highurg',theval) == -1){ $('#taskpriority').find('option[value=lowurg]').prop('disabled',false); } }); });
Comments
Post a Comment