select2 load data using ajax cannot select any option

余生颓废 提交于 2019-12-18 03:10:08

问题


I have the following code (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);
    }
});

For the server side I am using ASP MVC 4. The select get data using ajax and render the options but this options are not selectable. Reading other posts, they describe using the id function, but this function appearently desappears on the version of select2 I'm using 2.4

I'm following the example of ajax on the documentation showing on github "Loading remote data"


回答1:


If your ajax response doesn't have id and text attributes you should fix them client side

This is a requirement on version 4.0 (don't know why)

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
                    }
                };
            }

 }


来源:https://stackoverflow.com/questions/29035717/select2-load-data-using-ajax-cannot-select-any-option

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!