How to Collapse bootstrap accordion by click check box inside it

Question

I have a Bootstrap Accordion with a check box inside each of the accordion panel. When I check the checkbox inside of a panel, its parent should collapse and the next panel should open.

I am using the jQuery icheck plugin for styling checkboxes. So what I can do to make the accordion panels collapse? FIDDLE

$('.item1').on('ifChecked', function(event){

});

Answer 1

If I understood you correctly, you might want something like that:

Updated code:

// Toggle
$('.item1').on('ifChecked', function(event){
    $("#collapseOne").collapse("hide");
});
$('.item2').on('ifChecked', function(event){
    $("#collapseTwo").collapse("hide");
});
$('.item3').on('ifChecked', function(event){
    $("#collapseThree").collapse("hide");
});

$("#collapseOne").on("hidden.bs.collapse", function(e){
    $("#collapseTwo").collapse("show");
});
$("#collapseTwo").on("hidden.bs.collapse", function(e){
    $("#collapseThree").collapse("show");
});
$("#collapseThree").on("hidden.bs.collapse", function(e){
    $("#collapseOne").collapse("show");
});

First fiddle here: http://jsfiddle.net/sap1ruq2/1/

UPDATED fiddle here: http://jsfiddle.net/bstjmdLp/

Let me know if this was what you needed!