寫在前面
和隊友完成工程實踐項目過程中遇到combobox數據項加載失敗的問題,我將記錄下解決該問題中不斷填坑的過程。
這是可以確定的填寫正確的combobox內容
action也沒有錯誤,Struts配置也正常,但接收不到數據。后經排查,找到了問題所在。
即第一個要點,combobox接收參數的json數據格式:
[{"id":value,"name":value...},{},{},{}...]
這是JSONArray的格式,此處直接使用id,name等屬性名可直接訪問,並按照數組順序依次自動填充
如果是使用Struts-json自動轉換的方式,則需要action中將相應實體類對象放到list中,然后在result中使用json包中相應的方法完成。下面有示例:
獲取這樣的json格式即可,為方便展示,刪減了字段和記錄。
小技巧:因為json是Struts-json包自動轉的,為了知道具體的值,可以使用方法:JSONArray.fromObject(list)
寫到這里,因為圖方便,我的list是在方法中直接聲明的,於是combobox一直接收不到數據,也沒有任何報錯,combobox的執行成功和失敗函數均無反應。此處發現第二個知識點
即當前台接收不到json數據,控制台又沒有任何錯誤提示時,考慮Struts中轉json的數據源是否被識別,如上圖Struts配置中的jsonList。
所有經過Struts的數據傳遞,都必須要設置set、get方法。在配置文件中獲取數據也是如此,由於我在方法內部直接聲明的list,導致配置文件數據獲取失敗,無法傳遞json到前台,同時也不會報錯!!!
在填坑過程中,深入理解了combobox的使用,以及easyUI相關組件的使用
最大的感受是:請多查看官方文檔!!!請多查看官方文檔!!!請多查看官方文檔!!!
先貼上直通車鏈接:http://www.jeasyui.net/plugins/169.html
同時,我發現所有組件都是一樣的使用方式。
當組件沒有銷毀時,用id的方式可以直接獲取到 $('#id').combobox({url:value,valueField:value,textField:value,..}); --------其他組件則對應改名即可 如$('#id').form();
括號中可填寫對應參數,或對應方法,有多個時用逗號隔開即可。同時,若重復設置參數,則已設置過的參數的屬性值覆蓋,未設置過的參數屬性值更新。
相關屬性,事件,方法的使用
屬性直接賦值即可,事件就寫上 事件名:function(){} 對應參數要和官方要求的一致,方法需要單獨引用$('#id').combobox('方法名','參數');
例:
$("#cc").combobox({
url:'category_query.action', //數據請求
valueField:'id', //選項的value
textField:'type', //選項的顯示值
panelHeight:'auto', //自適應高度
panelWidth:120,//下拉列表是兩個組件組成的
width:120, //要同時設置兩個寬度才行
editable:false, //下拉框不允許編輯
//combobox繼承combo繼承validatebox,所以可以直接在這里設置驗證
required:true,
missingMessage:'請選擇所屬類別',
onLoadSuccess:function(){
// 加載成功時處理,事件的范例在此演示
var data = $('#cc').combobox('getData'); //此事件獲取從后台加載的json數據
alert(JSON.stringify(data)); //轉字符串並顯示
$('#cc').combobox('select','1'); //此事件設置下拉列表默認值為第一項
}, // 此方法沒有參數
onBeforeLoad:function(param){
}// param用於指定加載參數
});