我想从select2（）库的下拉列表中禁用剩余的选择选项

Question

I want to disable remaining select options from my dropdown of select2() library but I can't. I am generating a dynamic list of some brands in which I have some values like "All brands", "Honda", "Accord" etc., I want to disable all the select options if a user checks "all brands".

How can I do this?

Here's my jQuery code:

$("select.select2").change(function () {
    var selectedCountry = $(this).val();

    if (selectedCountry == 'all_brands') {
        $("dynamicList").prop("disabled", true)
    }
});

And this is my HTML & PHP code:

<label class="text-danger">Select Brands</label>
<select class="form-control select2" id="brandAll" multiple="multiple" name="brand_id" data-placeholder="Select Brand to Deal" style="width: 100%;">
    <option value="all_brands" id="checking123">All Brands</option>
    <?php 
    foreach ($brand_list as $brand) {
        echo "<option value='$brand->id' class='dynamicList'>$brand->name</option>";
    }
?>
</select>

Answer 1

In order to disable element using class selector try this:

$(".dynamicList").attr('disabled','disabled');

Note: this will disable all options, probably you would need to exclude the option with `"All Brands"``

$(".dynamicList").attr('disabled','disabled');
$("#checking123").removeAttr('disabled');

Bug #1 you are using multiple="multiple" then $(this).val() returns an array, not a single value.

Bug #2 you need to fix class selector: dynamicList -> .dynamicList

Here is the full code:

$("select.select2").change(function (){
       var selectedCountry = $(this).val();

       if (selectedCountry.length > 0 && selectedCountry[0] == 'all_brands') {
           $(".dynamicList").attr('disabled','disabled');
       }
});

Edit:

I would recommend to fix also html style, use double quotes for attributes:

echo '<option value="' . $brand->id . '" class="dynamicList">' . $brand->name . '</option>';

or even like this:

<label class="text-danger">Select Brands</label>
<select class="form-control select2" id="brandAll" multiple="multiple" name="brand_id" data-placeholder="Select Brand to Deal" style="width: 100%;">
    <option value="all_brands" id="checking123">All Brands</option>
    <?php foreach ($brand_list as $brand) { ?>
    <option value="<?php echo $brand->id ?>" class="dynamicList"><?php echo $brand->name ?></option>
    <?php } ?>
</select>