CODEWITHSUNDEEP
jquerysearchfilterattr
intelis
intelis

Reputation: 8068

Filter table with on data attribute with jQuery

I am trying to filter a table based on data attribute, instead on value inside the td tag.

The problem is, that I can't get it to work, because I always get this error:

Uncaught TypeError: Cannot call method 'match' of undefined 

$(document).ready(function(){
    var elemens = $("td")
    searchInput = $("#search")
    searchInput.on('keyup',function(){

        elemens.each(function(){

            var re = new RegExp(searchInput.val(), 'gi');
            if( $(this).data('gui').match(re) === null )
            {
                $(this).parent('tr').hide();
            }else{
                $(this).parent('tr').show();
            }

        });                
    });
});​

My Fiddle: http://jsfiddle.net/T57ba/3/

Upvotes: 1

Views: 1495

Answers (1)

Musa
Musa

Reputation: 97717

The data attributes are on the tr not the td, also .data() will convert the applicable types, in this case numbers. Instead use .attr()

$(document).ready(function(){
    var elemens = $("tr")
    searchInput = $("#search")
    searchInput.on('keyup',function(){            
        elemens.each(function(){                
            var re = new RegExp(searchInput.val(), 'gi');
            if( $(this).attr('data-gui').match(re) === null ){
                $(this).hide();
            }
            else{
                $(this).show();
            }

        });                
    });
});​

DEMO

Upvotes: 3

Related Questions