bootstrap select2插件用ajax来获取和显示数据的实例
用select2插件,实现以下这个选择框:
1、HTML代码
2、js代码
文字
提示
tags: true,//允许手动
添加
allowClear: true,//允许清空
ajax: {
url: '/jgwork/param_select',type:'GET',dataType: 'json',data: function(){ return {'projectId':$('#projectSel').val()}},processResults: function (data) {
return {
results: data.result
};
}
}
})
用ajax从服务端获取数据,在processResult里来返回数据
3、服务端代码
服务端返回的数据格式如下:
生成children字段列表
index += 1
data.append({
'text': item['paramName'],'children': childList
})
return JsonResponse({'result':data})
这里注意,index不能从0开始,不然生成的id有一个为0,会导致这个选项无法选取,因为在select2中id=0有特殊意义
以上这篇bootstrap select2插件用ajax来获取和显示数据的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。