当前位置: 首页 > 面试题库 >

如何通过Ajax请求将Select2与JSON一起使用?

邢晗日
2023-03-14
问题内容

我的Select2 3.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,每当在文本框中键入任何内容时,该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并且formatResult正在引起问题,因为我不知道应该在上面放置什么参数。我不知道从何处获取容器,对象和查询等参数以及应返回的值,还是我的JSON响应错误?


问题答案:

这里有一个例子

$("#profiles-thread").select2({
    minimumInputLength: 2,
    tags: [],
    ajax: {
        url: URL,
        dataType: 'json',
        type: "GET",
        quietMillis: 50,
        data: function (term) {
            return {
                term: term
            };
        },
        results: function (data) {
            return {
                results: $.map(data, function (item) {
                    return {
                        text: item.completeName,
                        slug: item.slug,
                        id: item.id
                    }
                })
            };
        }
    }
});

很简单



 类似资料:
  • 我的Select2 3.4.5不适用于JSON数据。 这是我在超文本标记语言上的输入框: ...和我的JavaScript 我用Laravel 4制作了一个API,每当我在文本框中键入任何内容时,它都会返回一个值。 如果我在输入框上键入“test”,结果如下: 我无法将结果添加到Select2下拉列表中。我认为是formatSelection和formatResult导致了这个问题,因为我不知道应

  • 问题内容: 我想为我的项目使用select2插件。我遵循了 此 示例,但对我而言不起作用。 JSON输出 : 剧本 : HTML : 这是我使用以下代码测试代码时的结果: Select2:AJAX结果未在响应键中返回数组。 我在哪里弄错了? 问题答案: 从提供的示例链接到所收到的错误消息,您似乎都在使用Select2 4.0。但是,您的代码是为Select2的早期版本编写的。 如果要继续使用Sel

  • 我无法使用jQuery行打印下面代码中的success。支持cors=true;。包括jQuery行。支持cors=真;将发出警告信息。那么,如何在不丢失功能的情况下避免这种情况呢?我的主要目标是调用一个返回JSON数据的RESTWeb服务,我必须利用JSON数据。请帮助我如何做到这一点。请提供工作样品

  • 我有一个问题,在我的应用程序Android中使用soap请求。我使用Ksoap2库。这是我的代码: }

  • 问题内容: 我在使用Ajax和php时遇到麻烦。我正在尝试做的是调用ajax函数,该函数从表单的输入中获取值,并检查数据库中是否存在该电子邮件。这是我当前的javascript: 不幸的是,我无法戒备。在我的PHP函数中,它检查输入的是用户名还是电子邮件(仅出于我的目的,所以您知道),然后在任一列中查找它。如果找到它,则返回true,否则返回false: 所以我的问题是,ajax如何响应这些返回值

  • 问题内容: 我一直在四处搜寻,但是我不太了解ajax的工作原理。 可否请人解释这是如何工作的? 我正在尝试做的是查看document.getElementsByClassName(current)是否已更改。如果有,它将询问app.py当前的评论和标签,并在不刷新的情况下更新页面。我也不知道该怎么写才能在app.py上收到它。 我将包含我的app.py,但这不是很好。 问题答案: 通常,服务器上的