본문 바로가기

javascript/Tabulator

타블레이터 tabulator 검색 기능 filter

타블레이터 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