본문 바로가기

javascript/Tabulator

타블레이터 tabulator 검색 기능 filter

See the Pen tabulator 타블레이터 검색 filter기능 by keepgoing-Noah (@keepgoing-noah) on CodePen.

타블레이터 tabulator에서 검색기능을 이용하고 싶을 때! search가 아니라 filter라는 점.. .!!

코드펜에 작성한 부분은 공식 문서 보고 대략적으로 보이게끔 만든 것이고...

 

아래는 실제 적용했던 코드 일부를 가져옴 !!


JS :

 

$(function(){
	mainApp.init();
});

//일부 복붙.
const mainApp = {
init: function(){
 document.getElementById("filter-value").addEventListener("keyup", this.crsrdFilter);
, 
crsrdFilter: function(){
		const valueEl = document.getElementById("filter-value");
		mainAppGrid.grid1.setFilter("C_NM", "like", valueEl.value); 
		document.getElementById("filter-clear").addEventListener("click", function(){
			valueEl.value = "";
			mainApp.grid1.clearFilter();
		});
	},
}

 

<input id="filter-value" type="text" placeholder="검색" >
<button id="filter-clear">ClearFilter</button>

 

728x90
300x250