【使用select2下拉框ajax加载数据时,编辑赋值的方法】最近在做一个项目,项目地址: https://github.com/wangyuanjun008/wyj-parent.git
使用bootstrap select2下拉框插件,ajax从后台加载数据,保存编辑后,不知道怎么为下拉框赋值,下拉框代码如下:
$("#sel_status").select2({
placeholder : "--请选择--",
dropdownParent : $("#myModal"),
allowClear : true,
width : 150,
ajax : {
url : '${ctx}/dataDict/getData?groupCode='+'yesOrNo',
dataType : 'json',
type : 'get',
data: function (params) {
return {
q: params.term, // search term 请求参数
page: params.page
};
},
processResults: function (data, params) {
params.page = params.page || 1;
return {
results: data,//itemList
pagination: {
more: (params.page * 30) < data.total_count
}
};
},
cache: true
}
});
通过查询api知道,在select4.0之后可以使用 $(“select”).val(“id”).trigger(“change”); 为下拉框赋值
你会发现下拉框中的数据是点击之后才会加载数据的,使用如上方法 ‘id’是未知的,原因是在编辑的时候下拉框的数据还没有加载出来
解决方法如下:
function getDataByGroupCode(groupCode){
var dataStore;
$.ajax({
dataType : 'json',
type : 'get',
url : model.dataURL+groupCode,
async : false,
success: function(data){
dataStore=data;
}
});
return dataStore;
}
var dataStore = getDataByGroupCode('yesOrNo');
$("#sel_status").select2({
placeholder : "--请选择--",
dropdownParent : $("#myModal"),
allowClear : true,
width : 150,
minimumResultsForSearch: -1,
data : dataStore
});
在页面加载的时候就加载下拉框数据,在编辑时就能为其赋值,问题解决!