본문 바로가기
  • A space that records me :)
Language/JS,JQuery

[jui] xtable grid filter

by yjkim_97 2021. 2. 1.

xtable 그리드 필터링 기능 커스텀

무조건 화면에 출력된 string으로 필터링하도록 수정

 

function xtableFilterChange(_xtable , column){
	if(_xtable == null){
		return;
	}
	
	var f = function(xtable) {
		return function(data,index) {
			var flag = true;
			
			xt = xtable;

			$.each(Object.keys(column),function(colIdx) {
				var _str = this.toString();
				var _colIdx = xt.options.fields.indexOf(_str);
				if (_colIdx < 0){ _colIdx = 0; }
				var _searchStr = column[_str].toUpperCase();
				var _dataStr = data[_str];
				var _rowList = xt.rowList;
				var _colText = _rowList.length ? _colText = _rowList[index].list[_colIdx].textContent.toUpperCase() : null;
				var _colType = xt.options.filterOption[_str].type;
				
				if (_searchStr != "") {
					if(_colType == "number"){
						_colText = _colText.replace(/,/g,"");
					}else if(_colType == "text"){
						// 컬럼에 tootip이 존재하면 tootip의 텍스트까지 함게 필터링
						if(_rowList[index].list[_colIdx].dataset.toggle == "tooltip"){
							_colText += _rowList[index].list[_colIdx].dataset.originalTitle; 
						}						
					}
					if (_colText == null|| _colText.indexOf(_searchStr) == -1) {
						flag = false;
						return;
					}
				}
			});

			return flag;
		};
	}(_xtable);
	
	_xtable.filter(f);
}

 

xtable grid 생성시 함수 적용

jui.ready(function(ui,uix,_){
	xtable_user = uix.xtable("#xtable_user", {
		fields : [ "empNo", "oprtrNm", "autGroupId", "cpnCretApvTkcgr" ],
		buffer : "scroll",
		bufferCount : 200,
		scrollWidth : 200,
		resize : true,
		colshow : true,
		filterOption : {},
		width : $('#xtable_user').outerWidth(),
		event : {
			filterChange : function(column, e) {
				// 필터링 함수
				xtableFilterChange(xtable_user, column);
			}
		}
	});
});