CODEWITHSUNDEEP
javascriptjqueryhtml
varun kumhar
varun kumhar

Reputation: 157

Highlighting rows based on conditions in two columns using jquery

I have a table like this:

S.No  Name  Year   Pay

 1      A   2004   100
 2      B   2005   200
 3      C   2004   75

Rows having Year = 2004 and Pay in {75, 200, 300} need to be highlighted. I'd like to use something like this:

$('tr').find('td:eq(2):contains(2004)')
  .parent()
    .find('td:eq(3)')
      .filter(function(){
        return parseInt($(this).text()) < 300;
      })
      .parent()
        .css('backgroundColor', '#E8E8E8');

In the above working jquery I need to replace the inner condition < 300 with something like in {75,200,300}

Kindly help me in debugging this issue.

Upvotes: 0

Views: 1533

Answers (2)

Joe Saad
Joe Saad

Reputation: 1950

How about using a regex for that? In case 

    $('tr').find('td:eq(2):contains(2004)').parent().find('td:eq(3)').filter(function(){
return parseInt($(this).text().match(/(75)|(200)|(300)/g));
}).parent().css('backgroundColor', '#E8E8E8');

I just did another way in the same fiddle: http://jsfiddle.net/joeSaad/6jPs9/#base

Upvotes: 1

Goran.it
Goran.it

Reputation: 6299

Try this Fiddle Demo

$('tr').filter(function() {
    var $this=$(this);
    // Search for 2004 and trim whitespace just in case in 3th column (year)
    if ($.trim($this.children('td').eq(2).text()) == "2004") {
        // Search for predefined values in 4th column and if found return true
        if ( ~['75', '200', '300'].indexOf( $.trim($this.children('td').eq(3).text()) ) ) {
            return true;
        }
        return false;
    }
    return false;
}).css('backgroundColor', '#E8E8E8');

Upvotes: 0

Related Questions