I have 2 dropdown groups as shown below
- on clicking + button more groups will be created dynamically.
- and the subcategory drop down is dynamically populated (from database) in the onchange event of category dropdown
The problem is i want to avoid the duplication of selection in subcategory dropdown
Any ideas given are welcome
EDIT 1:
$('.skill-subcategory').each(function(){
//var value = $(this).val();
var arr = [];
var selectedValue=$(this).attr('selected').value;
arr.push(selectedValue);
});
arr.each(function(i){
//var thisValue= $(this).value;
var selectedValuea = $(this).val();
var otherDropdowns = $('.skill-category').not(this);
otherDropdowns.find('option').prop('disabled', false); //reset all previous selection
console.log("value:" + selectedValuea);
otherDropdowns.find('option[value=' + selectedValuea + ']').prop('disabled', true);
});
});
//if(thisValue == arr[i])
//$(this).attr('disabled', true);
});
note:
.skill-subcategory is the class used in subcategory dropdown
.skill-category is the class used in category dropdown