select2使用ajax加载数据无法选择任何选项

Posted

技术标签:

【中文标题】select2使用ajax加载数据无法选择任何选项【英文标题】:select2 load data using ajax cannot select any option 【发布时间】:2015-05-16 03:22:45 【问题描述】:

我有以下代码(javascript):

$('#cbxConnections').select2(
    minimumInputLength: 0,
    multiple: false,
    allowClear: true,
    placeholder:
        text:"@Diccionario.Connections",
        id:" @Diccionario.Connections"
    ,
    ajax:
        url:'@Url.Action("GetActiveConnections","Admin")',
        dataType: 'json',
        type:'post',
        data:function(params)
            return 
                q: params.term
            ;
        ,
        processResults: function(data,page)
            return 
                results: data
            ;
        
    ,
    escapeMarkup: function (markup)  
        return markup; 
    ,
    templateResult: function(response)
        return '<div>'+response.Name+'</div>';
    ,
    templateSelection: function(response)
        return response.Id;
    ,
    id: function(connection)
       console.log(connection);
    
);

对于服务器端,我使用的是 ASP MVC 4。 select 使用 ajax 获取数据并呈现选项,但此选项不可选择。 阅读其他帖子,他们描述了使用 id 函数,但这个函数在我使用的 select2 版本上似乎消失了 2.4

我正在关注github 上显示的文档中的 ajax 示例 “正在加载远程数据”

【问题讨论】:

Unable to select a result from the select2 search results的可能重复 【参考方案1】:

如果您的 ajax 响应没有 idtext 属性,您应该在客户端修复它们

这是4.0版本的要求(不知道为什么)

ajax: 

   processResults: function (data, params) 

                params.page = params.page || 1;

                // you should map the id and text attributes on version 4.0

                var select2Data = $.map(data.result.data, function (obj) 
                    obj.id = obj._id.$id;
                    obj.text = obj.name;

                    return obj;
                );

                return 
                    results: select2Data,
                    pagination: 
                        more: data.result.more
                    
                ;
            

 

【讨论】:

谢谢!帮助很大。 感谢您的解释。 完美如我所愿。非常感谢。

以上是关于select2使用ajax加载数据无法选择任何选项的主要内容,如果未能解决你的问题,请参考以下文章

Select2 4.0.0 AJAX - 使用 Tab 选择突出显示的选项

Select2 4.0.0 AJAX - 使用Tab选择突出显示的选项

无法在编辑模式下设置多个选定值 select2

select2 ajax 显示结果但无法选择

单击某些按钮后select2中的动态选项

使用 AJAX 数据填充 Select2