在 Ajax 调用中更新多选字段时未选择多选答案

【问题标题】：Multi select is not selected when updating multiselect field in Ajax call在 Ajax 调用中更新多选字段时未选择多选
【发布时间】：2021-03-13 06:13:15
【问题描述】：

我正在使用AdminLTE 2 高级元素表单多选。当我使用多选插入表单的字段时，它会完美插入。

但是，当我使用相同的表单更新该多选字段时，此时未在选择输入标签中选择先前的插入值。它在下拉列表中被选中，我也无法更改所选字段。

我关注这个Select2 Doc

注意

ajax 响应正常

cdn、css和javascript正确集成

我试过这些代码

<div class="form-group" id="security_add">
    <label for="inputEmail3" class="col-sm-5 control-label">Select Area Name:</label>
    <div class="col-sm-7">
        <select class="form-control2 select2" multiple="multiple"  name="area_name_id[]" id="area_name_id">
             <option value="">-Selecr-</option>
             <option value="1">Bangladesh</option>
             <option value="2">USA</option>
             <option value="3">UK</option>
             <option value="4">UAE</option>
             <option value="5">Canada</option>
             <option value="6">India</option>
             <option value="7">Pakistan</option>

        </select>
    </div>
</div>

Javascript

$(document).ready( function () {

    $('.select2').select2()

} );

Ajax 更新方法

$('#area_name_id').val('');

$.ajax({

    type:"post",

    url:"./cc/area.php",

    data: {
        id:                     row_id,
        conditional_value:      1
    },

    success:function(response){

        $('#area_name_id').val(responseData.tbl_area_id);
        $('#area_name_id').trigger('change');
        
    }
});

【问题讨论】：

您返回多个值？显示responseData.tbl_area_id 的输出？
@Swati，是的。它像这样返回['1','2']
工作正常检查here
很好用

标签： javascript php jquery ajax

【解决方案1】：

这个很简单，比如select2

$('#area_name_id').val('');

替换为

var areaSelect = $('#area_name_id');

Ajax 请求如下所示

$('#area_name_id').val(responseData.tbl_area_id);
areaSelect.append(responseData.area_name_id).trigger('change');

【讨论】：