0

Hi all,

I'm currently looking at this JSFIDDLE and it's 50% of what I need.

I have a series of Accordions on my page (a list of courses). What I would like to do is assign these accordians to categories so that when a checkbox is pressed with the id of security any accordians with the security tag will show. If someone checks security and cisco all accordions with cisco AND security will show and so forth.

If you don't wan to open the JS Fiddle... the HMTL:

<input type="checkbox" id="set_1" checked> click to show text1
<p class = "wpbook_hidden wpbook_option_set_1"> This is option one</p>
<p class = "wpbook_hidden wpbook_option_set_1"> This is another option one</p>
<input type="checkbox" id="set_2"> click to show text1
<p class = "wpbook_hidden wpbook_option_set_2"> This is option two</p>

The JS:

$('.wpbook_hidden').hide();

$(':checkbox').change(function() {
    changeCheck(this);
});

$(':checkbox:checked').each(function(){
    changeCheck(this);
});

function changeCheck(x) {
    var option = 'wpbook_option_' + $(x).attr('id');
    if ($('.' + option).is(':visible')) {
        $('.' + option).fadeOut();
    }
    else {
        $('.' + option).fadeIn();
    }
}

This would be awesome, thanks!

1
Contributor
1
Reply
7
Views
3 Years
Discussion Span
Last Post by mmcdonald
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.