업무/jQuery/Ajax

[jquery] table row 필터링해서 보여주기

랄프위검 2015. 9. 11. 16:43



위그림처럼 부서이름에 타이핑을 하면 

테이블의 Row내용을 필터링해서 보여줘!



1. 테이블의 tr태그에 class를 먹인다.

<tr class="dept-data-row">



2. jquery문을 작성한다.

$("#searchDeptText").keyup(function() {

var data = this.value.split(" ");

if(this.value=="") {

$(".dept-data-row").show();

return;

}

$(".dept-data-row").hide();

$(".dept-data-row").filter(function (i, v) {

var $t = $(this);

 for (var d = 0; d < data.length; ++d) {

if ($t.is(":contains('" + data[d] + "')")) {

 return true;

}

}

return false;

}).show();

});


정말쉽다.


끝.