【问题标题】:Ajax selecting multiple values in select2Ajax在select2中选择多个值
【发布时间】:2020-02-25 10:04:16
【问题描述】:

我正在使用选择 2,并且我有来自 ajax 的 json 格式的数据。

查看:

<select class="form-control qual_id" multiple>
    <option value="">-Select Degree-</option>
    <option value="1">SSC</option>
    <option value="2">HSC</option>
    <option value="3">BBA</option>
    <option value="4">MBA</option>
</select>

阿贾克斯:

var defaultValue = 1,2 // (it can be one id or two ids)

$(`.qual_id option[value=${defaultValue}]`).attr('selected', true);

选择2:

<script type="text/javascript">
$('.qual_id').select2({
  width: 'resolve',
  maximumSelectionLength: 2
});
</script>

如果我从 select 标记中删除多个,并且在没有 select2 的情况下使用一个 id 执行此操作,则它是 工作正常,但我怎么能通过在选择中选择多个值来做到这一点。

控制台:

未捕获的错误:语法错误,无法识别的表达式:.qual_id 选项[值=1,2]

【问题讨论】:

    标签: php jquery ajax laravel jquery-select2


    【解决方案1】:

    几个月前我回答了一个类似的问题。您可以从Dynamically add item to jQuery Select2 control that uses AJAX 参考。

    要回答您的问题,请考虑以下示例。

    for(let i=0; i<jsonResponse.length; i++) {
        $(".qual_id").each(function() {
                if($(this).val() == jsonResponse[i]) {
                // select the option
            }
        });
    }
    $('.qual_id').trigger('change'); 
    

    您正在寻找的是 .trigger() 方法。参考Select2 Docs

    【讨论】:

    • 我试过 var defaultValue = data.qualifs for(let i=0; i.qual_id option[value=${defaultValue}]).attr('selected', true); } }); } $('.qual_id').trigger('change');
    • 您能否为它创建一个 jsfiddle 并分享链接。
    • 这里jsfiddle.net/1cszw2yg/1 将满足您的要求。
    • 谢谢,如何在列表顶部设置选定的值?
    • 要回答您的“将所选值强制置顶”,我能找到的最接近的解决方案是jsbin.com/cizehajema/2/edit?html,js,output。另外,请对我的第二条评论(带有 jsfiddle 链接)进行投票,以便未来的学习者轻松识别正确答案。谢谢。
    【解决方案2】:
    var defaultValue = [1,2];
    $(`.qual_id`).val(defaultValue);
    

    这应该设置默认选择值 1 和 2。

    【讨论】:

    • 控制台:未捕获的错误:语法错误,无法识别的表达式:.qual_id option[value=1,2]
    • 等等,你想用 select2 预选 2 个值吗?
    • 如果默认值设置为 1 或 2,或者在页面加载时同时设置该值,则应预先选择该值。
    • 我已经编辑了我的评论,误解了你最初想要的内容,希望新的编辑有所帮助!
    • 如何将它们设置为选中?以及其他所有未选择的内容?
    猜你喜欢
    • 2019-05-25
    • 2017-06-25
    • 2023-03-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-06
    • 1970-01-01
    相关资源
    最近更新 更多