1. 程式人生 > >使easyui中combobox控制元件支援本地資料自動補全

使easyui中combobox控制元件支援本地資料自動補全

easyui的combobox確實給我們實現自動補全功能帶來了便利,但是有時候我們為了減少伺服器壓力,會將一些不常更改的資料快取到前端,例如使用cookie和html5的storage進行快取.

那麼如何使用combobox實現對快取資料進行提示呢?直接上程式碼:

	filter:function(q, row){//當輸入資料時會呼叫該方法進行篩選過濾,支援鍵值同時搜尋
		var opts = $(this).combobox('options');
		return row[opts.valueField].indexOf(q) == 0||row[opts.textField].indexOf(q) ==0;
	},
	onClickIcon:function(){//使使用者點選combobox下拉按鈕時也能執行過濾
		var q=$(this).combobox("getValue");
		$(this).combobox("options").keyHandler.query.call(this,q);
		$(this).combobox("validate");
	}

通過easyui的filter屬性過濾好資料,為了使使用者點選下拉框時亦能有效,那麼為點選圖示按鈕也新增一個事件即可,

當用戶輸入錯誤的值後導致資料不能通過驗證時的處理方法請參考: 

當下拉框資料量大的時候會導致效率大大降低,那麼此時我們可以限定每次提示的資料量以提升效率,請參考: