您的位置:首页 > 其它

select2不显示中文、ajax加载数据后不能选中的标签选项

2017-03-17 16:10 183 查看
下面是遇到的几个问题:

1,关于select2国际化不显示中文的问题:

在页面上引用select2/js/i18n/zh-CN.js时,必须是紧挨着 select2.min.js文件的下一行才有用!!,经bz亲测,不紧挨着 select2.min.js放,尽管引用了zh-CN.js也白搭!!!

2,使用ajax加载数据后,选择后不显示选中的标签:

       ajax: {
            type:'GET',
            url: "${ctx}/topic/manager/search",
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    title: params.term, //请求参数
                    page: params.page
                };
            },
            processResults: function (data, params) {
                params.page = params.page || 1;
                var itemList = [];
                console.log(data);
                for(var i=0; i<data.length; i++){
                    itemList.push({id: data[i].id, text: data[i].title})
                }
                return {
                    results: itemList, //data.items,
                    pagination: {
                        more: (params.page * 30) < data.total_count
                    }
                };
            }
        },
        escapeMarkup : function(m) {  
            return m;  
        }

这样做是可以加载到数据:



但是选中其中选项之一:



下拉框关闭,并没有显示选中的值!!!

这个问题阻挡了我两个小时,其实解决起来特别简单,哥们以血的代价告诉你们千万别百度!!要去google,百度出来的内容大多重复且无用!下面是我的解决办法:

                 $.ajax({
url :"${ctx}/topic/manager/search",
type : 'get',
dataType : 'json',
success : function(data){
var itemList = [];
              console.log(data);
              for(var i=0; i<data.length; i++){
                  itemList.push({id: data[i].id, text: data[i].title})
              }
             $('#test_select2').select2({
    placeholder : '输入话题关键字',
    tags : true,
    multiple : true,
    height: '40px',
    maximumSelectionLength : 3,
    allowClear : true,
    language: "zh-CN",
    data : itemList
    });
}
})

我把select2的初始化动作放在了jquery的aja函数的success方法中!先拿数据,然后加工成select2识别的数组格式,再用data赋值!

下面是百度中出现次数最多、很多博客中一字不差的重复且无效的做法:

$("#test_select2").val(itemList).trigger('change');
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐