select2 ajax 設(shè)置默認(rèn)值,初始值的方法
在做功能的時(shí)候需要修改數(shù)據(jù), 修改數(shù)據(jù)時(shí)需要顯示原始值。
但是在select2的時(shí)候 顯示原始值是一個(gè)非常非常非常非常非常要命的難題。
研究了3個(gè)小時(shí), 最后使用$.ajax 重新加載原始值, 并顯示。
//two AJAX獲取數(shù)據(jù)方式(每次請(qǐng)求)
var $c_HospitalCode = $("#c_HospitalCode").select2({
ajax: {
type: 'GET',
url: "/Report/AjaxOption/Ajax_LoadHospitalByKey",
dataType: 'json',
delay: 400,
data: function (params) {
return {
key: params.term, // search term 請(qǐng)求參數(shù)
page: params.page,
MKORGCode: '@VModel.MKORGCode'
};
},
processResults: function (data, params) {
//重命名字段名
for (var i = 0; i < data.length; i++)
{
data[i].id = data[i].Value;
data[i].text = data[i].Name;
}
//params.page = params.page || 1;
return {
results: data//,//itemList
//pagination: {
// more: (params.page * 30) < data.length
//}
};
},
cache: true
},
placeholder: '請(qǐng)選擇',//默認(rèn)文字提示
//placeholder: { id: "2", text: "text2" },
language: "zh-CN",
tags: true,//允許手動(dòng)添加
separator: ",", // 分隔符
allowClear: true,//允許清空
escapeMarkup: function (markup) { return markup; }, // 自定義格式化防止xss注入
minimumInputLength: 3,//最少輸入多少個(gè)字符后開始查詢
formatResult: function formatRepo(repo) { return repo.text; }, // 函數(shù)用來渲染結(jié)果
formatSelection: function formatRepoSelection(repo) { return repo.text; }//, // 函數(shù)用于呈現(xiàn)當(dāng)前的選擇
});
重點(diǎn)是下面的代碼, 再次加載默認(rèn)值. 賦值.
//再次加載默認(rèn)值. 賦值.
$.ajax({
url: "/Report/AjaxOption/Ajax_LoadHospitalByHospitalCodes",
data: { HospitalCodes: '@VModel.HospitalCode' },
dataType:'json',
success: function (data) {
for (var d = 0; d < data.length; d++) {
var item = data[d];
var option = new Option(item.Name, item.Value, true, true);
$c_HospitalCode.append(option);
}
$c_HospitalCode.trigger('change');//使用這個(gè)方法顯示到select2上.
}
});
主要是在select 控件添加上 option . 具體是ajax加載的還是直接后臺(tái)用代碼生成的. 都可以.. 最后用 $select2.trigger(‘change'); 渲染到界面上.. 就可以了。
以上這篇select2 ajax 設(shè)置默認(rèn)值,初始值的方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
D3.js封裝文本實(shí)現(xiàn)自動(dòng)換行和旋轉(zhuǎn)平移等功能
之前小編和大家分享了SVG中如何配合使用text和tspan來實(shí)現(xiàn)換行的功能,所以這篇文章對(duì)此功能進(jìn)行一下封裝,以后就可以直接用了。有需要的朋友們可以參考借鑒,下面來一起看看吧。2016-10-10
JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉查找樹的定義與表示方法
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉查找樹的定義與表示方法,簡單講述了二叉查找樹的概念、特點(diǎn)及javascript針對(duì)二叉查找樹的創(chuàng)建、插入、遍歷等操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-04-04
學(xué)習(xí)javascript的閉包,原型,和匿名函數(shù)之旅
Javascript中有幾個(gè)非常重要的語言特性——對(duì)象、原型繼承、閉包。其中閉包 對(duì)于那些使用傳統(tǒng)靜態(tài)語言C/C++的程序員來說是一個(gè)新的語言特性,本文給大家介紹js的閉包,原型,和匿名函數(shù)之旅,感興趣的朋友一起學(xué)習(xí)吧2015-10-10
javascript使用正則表達(dá)式檢測(cè)IP地址
這篇文章主要介紹了javascript使用正則表達(dá)式檢測(cè)IP地址的方法,需要的朋友可以參考下2014-12-12
基于element-ui?動(dòng)態(tài)換膚的代碼詳解
這篇文章主要介紹了element-ui?動(dòng)態(tài)換膚,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-03-03
kindeditor修復(fù)會(huì)替換script內(nèi)容的問題
這里給大家分享的是個(gè)人修改的kindeditor的代碼,主要是修復(fù)了一些BUG,添加了些常用功能,推薦給大家,有需要的小伙伴可以參考下。2015-04-04

