Question

我遇到了Jquery Select2的问题。我想设置一个select2选项来更改另一个select2选择框。

        var categorySelect = $('#category_select');
        var productSelect = $('#product_select');
        categorySelect.select2();
        productSelect.select2();
        categorySelect.on('change',function () {
            var categoryId = $(this).val();
            var url = "{{url("/ajax/category/:category/products")}}";
            url = url.replace(":category",categoryId);
            $.get(url,function (res) {
                var res = [
                    {id: 900, text: 'AABB'},
                    {id: 800, text: 'WWBB'},
                ]; // dummy response
                productSelect.select2('data',res);
            })
        })

这里我遵循他们的文档，但无法理解为什么再次设置数据没有得到。

Answer 1

我以我的方式解决了这个问题。我正在循环响应数据数组并为产品选择框创建选项

var categorySelect = $('#category_select');
var productSelect = $('#product_select');
categorySelect.select2();
productSelect.select2();
categorySelect.on('change',function () {
    var categoryId = $(this).val();
    var url = "{{url("/ajax/category/:category/products")}}";
    url = url.replace(":category",categoryId);
    $.get(url,function (res) {
        var res = [
            {id: 900, text: 'AABB'},
            {id: 800, text: 'WWBB'},
        ];
        if(res.length > 0) {
            productSelect.empty();
            res.forEach(function (prod) {
                var opt = $('<option>', {
                    'value' : prod.id
                }).text(prod.text);
                productSelect.append(opt);
            });
        }
    })
});

重置select2上的所有选项并加载另一个数据集

1 个答案: