CODEWITHSUNDEEP
javascriptjquery
Danny Englander
Danny Englander

Reputation: 2044

JQuery addclass to another div (but not parent) if no data is found

I have this to add a class to the main table that the report is in if there is no data returned.

$('#report-area table td:contains("Sorry, your search did not return any data")').parents('#report-area').addClass('no-report-data')

However, I have another div area "#report-footer" but it's not inside #report-area. I'd like to also add the .no-report-data class to "#report-footer" as well but in this case I don't think the .parents selector will work. Is there another selector I can use to do this?

Upvotes: 0

Views: 196

Answers (4)

mu is too short
mu is too short

Reputation: 434755

ID attributes are unique per-page so you can just say this:

$('#report-footer').addClass('no-report-data');

You could also skip the parents altogether and do them both at once:

if($('#report-area table td:contains("Sorry, your search did not return any data")').length)
    $('#report-area, #report-footer').addClass('no-report-data');

Upvotes: 1

sanbor
sanbor

Reputation: 1282

I think that this might work

var uglySelector = 'table td:contains("Sorry, your search did not return any data")';
$('#reportArea:has(#report-area ' + uglySelector +'), #report-footer ' + uglySelector).addClass('no-report-data');

I recommend you to avoid that long creepy selector ("table td:contains..."), when you write the message "Sorry..." message, just add a class to that td to distinct it later.

Upvotes: 1

tthreetorch
tthreetorch

Reputation: 426

Reference link http://visualjquery.com/

Upvotes: 1

Jake Feasel
Jake Feasel

Reputation: 16955

How about something like this? It's not real sexy, but should work....

var $noData = $('#report-area table td:contains("Sorry, your search did not return any data")').parents('#reportArea');

if ($noData.length)
{
  $noData.addClass('no-report-data');
  $("#report-footer").addClass('no-report-data');
}

Upvotes: 0

Related Questions