bootstrap selectpicker 動態載入資料
阿新 • • 發佈:2019-01-27
實現:
spring mvc負責後臺,ajax負責前臺。所有程式碼均為本人工程中真正應用的程式碼,肯定可行,網上找到各種大bug的程式碼真是moutain people moutain sea啊!!!!
下拉框寫法(是否帶搜尋功能之類的看業務要求和您個人喜好了):
選擇學校--: <select id="schoolno" name="schoolno" class="selectpicker" > </select>
js程式碼:
function getschoolList() {//獲取下拉學校列表 $.ajax({ url: "/eschool/viewEschoolList"Safari和chrome測試均沒問題,IE懶得測,沒有windows電腦~~~,//寫你自己的方法,返回map,我返回的map包含了兩個屬性:data:集合,total:集合記錄數量,所以後邊會有data.data的寫法。。。 // 資料傳送方式 type: "get", // 接受資料格式 dataType: "json", // 要傳遞的資料 data: 'data', // 回撥函式,接受伺服器端返回給客戶端的值,即result值 success: function (data) { //alert(data.data); $.each(data.data, function (i) { // alert(i); // $("<option value='" + data.data[i].schoolno + "'>" + data.data[i].schoolname + "</option>")// .appendTo("#schoolno.selectpicker"); $('#schoolno.selectpicker').append("<option value=" + data.data[i].schoolno + ">" + data.data[i].schoolname + "</option>"); }); $('#schoolno').selectpicker('refresh'); }, error: function (data) { alert("查詢學校失敗"+ data); } }) }