Question

好的，我觉得我在这里疯了。我使用select2 jquery插件（版本4），并通过ajax检索数据。因此，您可以输入名称，它将返回该联系信息。但我也想要回复那个联系人所属的组织。

这是我的select2初始化：

$('#contact_id').select2({
    ajax: {
        url: 'example.com/contacts/select',
        dataType: 'json',
        delay: 250,
        data: function (params) {
            return {
                q: params.term,
                page: params.page
            };
        },
        processResults: function (data) {
            return {
                results: data
            };
        },
        cache: true
    },
    minimumInputLength: 3,
    maximumSelectionLength: 1
});

这是我回来的数据（laravel框架）：

foreach($contacts as $con) {
    $results[] = [
        'id'    => $con->contact_id,
        'text'  => $con->full_name,
        'org'   => [
            'org_id'        => $con->organization_id,
            'org_name'      => $con->org_name
        ]
    ];
}

return response()->json($results);

所以不是＆＃39; org＆＃39;应该通过select2附加到创建的选项或select元素？所以我可以做一些像$('#contact_id').select2().find(':selected').data('data').org或$('#contact_id').select2().data('data').org这样的事情吗？

理想情况下，这看起来像：

<select>
    <option value="43" data-org="{org_id:377, org_name:'Galactic Empire'}">Darth Vader</option>
</select>

我发誓我上周确认这项工作，但现在它完全忽略了那个组织财产。我已经确认返回的json数据确实包含org和正确的org_id和org_name。我还没有能够在线挖掘任何内容，只有documentation的这个片段：

每个对象都需要id和text属性，这些属性是Select2用于内部数据对象的属性。传入数据对象的任何其他参数都将包含在Select2公开的数据对象中。

所以有人可以帮我这个吗？我已经浪费了几个小时了。

编辑：由于我没有得到任何回复，我目前的计划是使用processResults回调来生成隐藏的输入字段或JSON块，稍后我将参考我的代码。考虑到这种情况，我觉得这是一个hacky解决方案，但如果没有别的办法，这就是我要做的事情。我宁愿做另一个ajax调用以获得组织。当我开始实施它时，我会发布我的解决方案。

Answer 1

暂时不能评论（声望很低）..所以...回答光滑：

包括其他数据（v4.0）：

    List<int> numbers = new List<int> {2, 1, 3, 1, 2, 3, 1, 3, 3, 2};

    int minindex =1, maxindex =3, minimum=-1;

    if(minindex <= maxindex && maxindex>=0  && maxindex >=0 && maxindex < numbers.Count())
    {
        minimum = Enumerable.Range(minindex, maxindex-minindex+1) // max inclusive, remove +1 if you want to exclude
            .Select(x=> numbers[x])    // Get the elements between given indices
            .Min();                    // Get the minimum among.    
    }

阅读数据：

processResults: function (data) {
    data = data.map(function (item) {
        return {
            id: item.id_field,
            text: item.text_field,
            otherfield: item.otherfield
        };
    });
    return { results: data };
}

Answer 2

不记得我做错了什么，但是对于processResults(data)，数据包含完整的回复。在下面的实现中，我在选择项目时访问此信息：

$('#select2-box').select2({
    placeholder: 'Search Existing Contacts',
    ajax: {
        url: '/contacts/typeahead',
        dataType: 'json',
        delay: 250,
        data: function(params){
            return {
                q: params.term,
                type: '',
                suggestions: 1
            };
        },
        processResults: function(data, params){
            //Send the data back
            return {
                results: data
            };
        }
    },
    minimumInputLength: 2
}).on('select2:select', function(event) {
    // This is how I got ahold of the data
    var contact = event.params.data;

    // contact.suggestions ...
    // contact.organization_id ...
});



// Data I was returning
[
    {
        "id":36167, // ID USED IN SELECT2
        "avatar":null,
        "organization_id":28037,
        "text":"John Cena - WWE", // TEXT SHOWN IN SELECT2
        "suggestions":[
            {
                "id":28037,
                "text":"WWE",
                "avatar":null
            },
            {
                "id":21509,
                "text":"Kurt Angle",
                "avatar":null
            },
            {
                "id":126,
                "text":"Mark Calaway",
                "avatar":null
            },
            {
                "id":129,
                "text":"Ricky Steamboat",
                "avatar":null
            },
            {
                "id":131,
                "text":"Brock Lesnar",
                "avatar":null
            }
        ]
    }
]

Select2 - 通过ajax调用传回附加数据

2 个答案: