開局附上最最最有用的官方文檔。
劃重點⚠️:easyui使用手冊
進入正題--------------------------------------------------------------------------------------------------------------------------------------------------------------
現象:
有這樣一段代碼,瀏覽器請求getSystemSignList方法有返回數據並且嚴格符合easyui的應答規範--一個json格式的list對象。
<tr>
<td class="FormdataL">系統標識:</td>
<td width="400px">
<input class="easyui-combobox" style="width:110px;" id="systemSign"
name="systemSign" editable="false" url="${pageContext.request.contextPath}/dictionary/dictionary!getSystemSignList.action" valueField="itemCode" textField="itemName" disabled="true">
</td>
</tr>
現象是textField不顯示查出來的值。顯示的是個0. 於是進入一臉懵逼的狀態。。。。。。
valueField:基礎數據值名稱綁定到Combobox(提交值)
textField:基礎數據的字段名稱綁定的Combobox(顯示值)
排查:
首先確定就是頁面展示的問題了,因爲瀏覽器請求的response結果是符合要求的,但是爲什麼展示不出來呢?
首先看哪裏有沒有對id="systemSign" 做了改變。果不其然有如下一行代碼:
$(document).ready(function(){
$('#systemSign').combobox('select', '${systemSign}');
});
一直不理解這是什麼意思,感覺並沒有什麼操作呀,奇奇怪怪。
官方文檔這麼迴應:
可能覺得太簡單?不屑於過多的解釋?反正就是你現在看到的這麼可憐的一句話。
那就只能我去翻譯一下啦
用法實例:$('#customerStatusList').combobox('select', '1');
解釋:id="customerStatusList"的輸入框,指定value=1的對象,顯示的內容都是此對象的內容。
這樣一來,一切都解釋通了。
首先getSystemSignList方法會查詢很多個對象組成的一個list,那麼顯示的的話需要選擇其中的一個對象,一般我們會想遍歷,但是這個框架就是這麼的便捷,你不需要遍歷,你只需要指定value是哪個,它自動給你選出來這個對象,然後自然他的值隨你處置。
頁面加載完成,就將id=systemSign的框進行指定對象,指定value對應的對象,進行展示。
爲了方便理解,下面是實例版:
如果請求應答結果是
[{
"id":1,
"text":"text1"
},{
"id":2,
"text":"text2"
},{
"id":3,
"text":"text3",
"selected":true
},{
"id":4,
"text":"text4"
},{
"id":5,
"text":"text5"
}]
那麼可以通過以下兩種方法指定默認值:
$('#customerStatusList').combobox('select', '1');//選擇id=1的對象text
或者
$("#customerStatusList").combobox("setValue",1);//選擇id=1的對象text
設計借鑑:
有一個查詢列表的方法很多地方都用到了,有的用所有的,有的用其中的一個,那就非常合適用easyui的這個。
用所有的就不必說了,用其中的一個的,只需要指定value就可以選擇啦。非常方便。