CODEWITHSUNDEEP
jquery
Fero
Fero

Reputation: 13315

How can I show only the div which does not contain a check box using jQuery?

I have the following div structure:

<div class="members-content">
<a>Studen ...</a>
</div>

<div class="members-content">
<a>Studen ...</a>
<input type="checkbox" class="form-checkbox" >
</div>

<div class="members-content">
<a>Studen ...</a>
<input type="checkbox" class="form-checkbox" >
</div>

How can I show only the div which DOES NOT contain a check box ?

Upvotes: 0

Views: 58

Answers (4)

nnnnnn
nnnnnn

Reputation: 150030

To show the one without a checkbox:

$("div.members-content:not(:has(:checkbox))").show();

To hide the ones with a checkbox:

$("div.members-content").has(":checkbox)").hide();

// could also hide with the following, but less effecient:
$("div.members-content:has(:checkbox)").hide();

Or, an arguably simpler approach is just to start by hiding them all and then show the one you want:

$("div.members-content").hide();
$("div.members-content:not(:has(:checkbox))").show();

// OR
var members = $("div.members-content");
members.hide();
members.not(":has(:checkbox)").show();

Upvotes: 1

Shyju
Shyju

Reputation: 218732

$('.members-content').hide();
$('div:not(:has(input[type="checkbox"]))').show()

This will hide everything except the div which does not have any checkbox

Working sample : http://jsfiddle.net/4kYcx/14/

Upvotes: 0

epignosisx
epignosisx

Reputation: 6192

Here you go:

$(function(){
    $("div.members-content").filter(function(){
        return $(this).find(":checkbox").length > 0;
    }).hide();
});

Upvotes: 0

Damon Bauer
Damon Bauer

Reputation: 2726

Try: $('.members-content:not(:has(input))')

Upvotes: 2

Related Questions