當作為提示框的方式時,combobox必須設定為允許使用者輸入的模式,但是當用戶輸入後未選擇正確的資料就直接按tab或點選滑鼠離開控制元件會導致使用者輸入無效的值並且通過驗證,為了避免這種情況的發生我們需要對輸入的值進行確認,輸入不正確就清空使用者的輸入框以達到提示的效果

上程式碼:

1. onHidePanel : function() {  
2.     var _options = $(this).combobox('options');  
3.     var _data = $(this).combobox('getData');/* 下拉框所有選項 */
4.     var _value = $(
   this).combobox('getValue');/* 使用者輸入的值 */
5.     var _b = false;/* 標識是否在下拉列表中找到了使用者輸入的字元 */
6.     for (var i = 0; i < _data.length; i++) {  
7.         if (_data[i][_options.valueField] == _value) {  
8.             _b=true;  
9.             break;  
10.         }  
11.     }  
12.     if(!_b){  
13.         $(this).combobox('setValue'
    , '');  
14.     }  
15. },  

修改的js檔案為\jquery.easyui.js，可以搜尋到onHidePanel這個方法，上面是去匹配下拉值，如果我們用下面的程式碼去實現用顯示值去匹配，就會出現選擇選項的值會被清空的bug

onHidePanel: function () {
    var _options = $(this).combobox('options');
    var _data = $(this).combobox('getData');/* 下拉框所有選項 */
    var _value = $(this).combobox('getValue');/* 使用者輸入的值 */
    var _b = false;/* 標識是否在下拉列表中找到了使用者輸入的字元 */
    for (var i = 0; i < _data.length; i++) {
        if (_data[i][_options.textField] == _value) {
            _b = true;
            break;
        }
    }
    if (!_b) {
        $(this).combobox('setValue', '');
    }