ajax - Select2 使用 Ajax 从文件加载数据

Question

我有一个名为 listofValues.php 的脚本，它查询数据库并返回 JSON 格式值。

我需要的是将这些值传递给 select2 data 成员。我需要它加载一次。

我不需要将值从 select2 输入(术语)传递到我的 listofValues.php，如 this example 中所述。

$('#select2div').select2({
        //data:[],
    ajax: {
        dataType: "json",
        url: "listofvalues.php",    
        success: function (data) {          
        }
    }

你能帮我解决这个问题吗？

Answer 1

简单示例

了解从 listofvalues.php 返回的对象的格式会很有用，但为了简单起见，我们假设它看起来像这样:

[ {"id": 1, "text": "option1"},
  {"id": 2, "text": "option2"},
  {"id": 3, "text": "option3"} ]

这是最容易使用的格式，因为默认情况下，select2 可以处理具有属性名称 id 和 text 的对象，并将它们渲染为一个下拉列表。因此，您的 select2 初始化可能如下所示:

$('#select2div').select2({
    ajax: {
        dataType: "json",
        url: "listofvalues.php",
        results: function (data) {
            return {results: data};
        }
    }
});

稍微棘手的示例

现在我们假设 listofvalues.php 中的数据不遵循方便的命名约定:

[ {"id": 1, "firstName": "John", "lastName": "Lennon"},
  {"id": 2, "firstName": "Paul", "lastName": "McCartney"},
  {"id": 3, "firstName": "George", "lastName": "Harrison"},
  {"id": 4, "firstName": "Ringo", "lastName": "Starr"} ]

我们必须设置一个函数来处理输出:

function formatValues(data) {
    return data.firstName + ' ' + data.lastName;
}

以及我们的select2初始化:

$('#select2div').select2({
    ajax: {
        dataType: "json",
        url: "listofvalues.php",
        results: function (data) {
            return {results: data};
        }
    },
    formatResult: formatValues
});

让我知道你过得怎么样。