如何通过 Ajax 请求将 Select2 与 JSON 结合使用?

2023-11-30

My Select23.4.5 不适用于 JSON 数据。

这是我的 HTML 输入框:

<input class='form-control col-lg-5 itemSearch' type='text' placeholder='select item' />

……还有我的 JavaScript

$(".itemSearch").select2({
    placeholder: "Search for an Item",
    minimumInputLength: 2,
    ajax: {
        url: "/api/productSearch",
        dataType: 'json',
        quietMillis: 100,
        data: function (term, page) {
            return {
                option: term
            };
        },
        results: function (data, page) {
            var more = (page * 10) < data.total;
            return {
                results: data.itemName,
                more: more
            };
        }
    },
    formatResult: function (data, term) {
        return data;
    },
    formatSelection: function (data) {
        return data;
    },
    dropdownCssClass: "bigdrop",
    escapeMarkup: function (m) {
        return m;
    }
});

我用 Laravel 4 创建了一个 API,每当我在文本框中输入任何内容时,它都会返回一个值。

如果我在文本框中输入“test”,结果如下:

[{"itemName":"Test item no. 1","id":5},
{"itemName":"Test item no. 2","id":6},
{"itemName":"Test item no. 3","id":7},
{"itemName":"Test item no. 4","id":8},
{"itemName":"Test item no. 5","id":9},
{"itemName":"Test item no. 6","id":10},
{"itemName":"Test item no. 7","id":11}]

我无法将结果添加到我的 Select2 下拉列表中。我认为formatSelection and formatResult导致问题的原因是我不知道应该在其上放置什么参数。我不知道从哪里获取容器、对象和查询等参数以及它应该返回的值,或者我的 JSON 响应是错误的?


for 选择2 v4.0.0稍微不一样

$(".itemSearch").select2({
    tags: true,
    multiple: true,
    tokenSeparators: [',', ' '],
    minimumInputLength: 2,
    minimumResultsForSearch: 10,
    ajax: {
        url: URL,
        dataType: "json",
        type: "GET",
        data: function (params) {

            var queryParameters = {
                term: params.term
            }
            return queryParameters;
        },
        processResults: function (data) {
            return {
                results: $.map(data, function (item) {
                    return {
                        text: item.tag_value,
                        id: item.tag_id
                    }
                })
            };
        }
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何通过 Ajax 请求将 Select2 与 JSON 结合使用? 的相关文章

随机推荐