通过ajax调用更新选择字段时未选择Select2 [英] Select2 is not selected when update a select field by ajax call

问题描述

我在选择选项中使用 select2 类时遇到问题.当我通过 ajax 调用使用字段 select2 类插入表单数据时，它工作正常

但是当我通过 ajax 首先调用相同的表单来更新 select2 字段时，它不是我首先插入的选定值.

注意

ajax 响应工作正常

cdn、css 和 javascript 正确集成

我在下面试过

输入字段

<label for="inputEmail3";class=col-sm-5 control-label">状态:</label><div class="col-sm-7"><select class="form-control select2";name="status_user";id="status_user";样式=宽度:100%；"><选项值=">-选择-</option><option value=1">Active</option><option value=0">Inactive</option></选择>

Javascript

$(document).ready( function () {$('.select2').select2()});

Ajax 更新

$('#status_user').val('');$.ajax({类型:帖子"，网址:./cc/xyz.php"，数据: {row_id: action_id,条件值:14},成功:功能(响应){var responseData = JSON.parse(response);$('#status_user').val(responseData.status_user);}});

解决方案

几天前我遇到了同样的问题.我已经从 Select2 文档 中解决了这个问题>

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

替换成这个

var statusSelect = $('#status_user');

并在您的 ajax 请求中添加新行

$('#status_user').val(responseData.status_user);statusSelect.append(responseData.status_user).trigger('change');//添加这一行

I am facing a problem when I use select2 class in select option. When I insert a form data using a field select2 class by ajax call then it is working properly

But when I update that select2 field by ajax calling same form firstly it is not selected value that I inserted first.

Note

ajax response is working properly

cdn, css and javascript integrated properly

I have tried below

Input Field

<div class="form-group">
    <label for="inputEmail3" class="col-sm-5 control-label">Status:</label>
    <div class="col-sm-7">
        <select class="form-control select2" name="status_user" id="status_user" style="width:100%;">
            <option value="">-Select-</option>
            <option value="1">Active</option>
            <option value="0">Inactive</option>
         </select>
    </div>
</div>

Javascript

$(document).ready( function () {

    $('.select2').select2()

} );

Ajax Update

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

$.ajax({

        type:"post",

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

        data: {
            row_id:                 action_id,
            conditional_value:      14
        },

        success:function(response){

            var responseData =  JSON.parse(response);
            $('#status_user').val(responseData.status_user);
            
        }
    });

解决方案

I was facing same problem few days ago. I have solved this issue from Select2 Documentation

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

Replace by this

var statusSelect = $('#status_user');

And in your ajax request add new line

$('#status_user').val(responseData.status_user);
statusSelect.append(responseData.status_user).trigger('change'); // Add this line

这篇关于通过ajax调用更新选择字段时未选择Select2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！