CODEWITHSUNDEEP
javascriptjquerysearchfor-loop
EasyBB
EasyBB

Reputation: 6554

trying to find if title contains word then hide that parent element

    var search_input = $('#input_search');
    var search_console = search_input.val();
    var header_console = $('.header');
    $('#enter_console').click(function() {
        var bodies = $('.reviews');
        for(var i=0;i<bodies.length;i++){
            var bodies = bodies[i];
            if($(bodies).find(header_console).filter(':contains("+search_console+")')) {
                bodies[i].hide();
            }
        }
    });

I am trying to find if the bodies has the word that a user types in in the input. Then if that bodies has the word hide the rest of the elements except it. Can anyone help me??? Basic html looks like

<div id="2343" class="reviews">
    <h2>Animal Crossing: City Folk</h2><h3 class="header">Wii</h3>
    <p>8/10</p>
    <img src="http://i1231.photobucket.com/albums/ee512/Rukiafan23/1_zpsdab192dc.jpg" alt="{title}"> 
    <a href="http://www.wiiwarewave.com/t93-animal-crossing-city-folk">
        Read this Review
    </a>
    <div class="inner_box_review">----</div>
</div>

Upvotes: 0

Views: 257

Answers (1)

Kevin B
Kevin B

Reputation: 95020

This should do it:

$('#enter_console').click(function() {
    var search_input = $('#input_search'),
        search_console = search_input.val(),
        header_console = $('.header');
    $('.reviews:has(.header:contains("' + search_console + '"))').hide();
});

fixed a quote issue as well.

the selector says: "Select all elements with class "reviews" that have at least one descendant that contains the text stored within search_console."

If you need to do the opposite and hide all that DONT have said text, you need .not( or :not()

$('#enter_console').click(function() {
    var search_input = $('#input_search'),
        search_console = search_input.val(),
        header_console = $('.header');
    $('.reviews').not(':has(.header:contains("' + search_console + '"))').hide();
});

or

$('#enter_console').click(function() {
    var search_input = $('#input_search'),
        search_console = search_input.val(),
        header_console = $('.header');
    $('.reviews:not(:has(.header:contains("' + search_console + '")))').hide();
});

Upvotes: 4

Related Questions