Select2：禁用选定的选项值不起作用

Posted 2023-03-14

【中文标题】Select2：禁用选定的选项值不起作用

【英文标题】：Select2: Disabled selected option value not working

【发布时间】：2019-10-04 06:59:00

【问题描述】：

我有一个模块，您可以将数量从“仓库来自”转移到“仓库到”（仓库来自和仓库到这些是我的下拉菜单）

我想验证一下，您不能再选择来自“仓库来自”的第一个选定仓库

查看

<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 input-padding-left">
    <div class="form-group">  
        <label>Document Reference</label>
        <input type="text" name="document_reference" class="form-control">
    </div>
    <div class="form-group">
        <label>From:</label>
        <select class="form-control warehouse" name="warehouse_from" required="required" id="warehouse_from" style="width: 100%;">
            <option></option>
            <option value="0">Unassigned Warehouse</option>
            @if($warehouses)
                @foreach($warehouses as $v => $warehouse)
                    <option value=" $warehouse->id "> $warehouse->name </option>
                @endforeach
            @endif
        </select>
    </div>
</div>
<hr>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 input-padding-right">
    <div class="form-group">
        <label>Posting Date</label>
        <input type="text" name="posting_date" class="form-control dates">
    </div>
    <div class="form-group">
        <label>To:</label>
        <select class="form-control warehouse" name="warehouse_to" id="warehouse_to" required="required" style="width: 100%;">
            <option></option>
            @if($warehouses)
                @foreach($warehouses as $v => $warehouse)
                    <option value=" $warehouse->id "> $warehouse->name </option>
                @endforeach
            @endif
        </select>
    </div>
</div>

jQuery

$('.warehouse').select2(
        placeholder: "Select a Warehouse",
    );
    $(document).on('select2:select', '#warehouse_from', function(e)
        // $('#warehouse_from  ').on('change',function()
        //send ajax request
        var id         = $(this).val(); 
        var val        = $('#warehouse_from option:selected').text();
        alert(val);
       $(this).find('option').prop('disabled',false);  
       $(this).find('option[value='+val+']').prop('disabled',true);
        getItemsByWarehouse(id);
        e.preventDefault();
        return false;
    );

问题：为什么我的残疾人没有工作？

【参考方案1】：

您得到的是文本，而不是所选选项元素的值：

var val = $('#warehouse_from option:selected').text();
// ...
$(this).find('option[value='+val+']').prop('disabled',true);

应该是：

var val = $('#warehouse_from option:selected').val();
// ...
$(this).find('option[value='+val+']').prop('disabled',true);

【参考方案2】：

我的错误是我禁用了来自未在warehouse_to 中的warehouse_from 的值。

**Jquery**

$(document).on('select2:select', '#warehouse_from', function(e)
        //send ajax request
        var id         = $(this).val(); 
        var val        = $('#warehouse_from option:selected').text();
        alert(id);
       $('select#warehouse_to>option[value="'+id+'"]').attr('disabled','disabled');
        getItemsByWarehouse(id);
        e.preventDefault();
        return false;
    );