CODEWITHSUNDEEP
jqueryradio-buttonslidetoggle
danzo
danzo

Reputation: 301

Reset radio buttons only if the div they're in is toggled closed, but not if another div is toggled open?

I have a page with multiple jQuery slideToggles. Earlier, I asked a question about how to reset selections in one of the toggles when the toggle is closed here: How to reset selected radio buttons when closing slideToggle?

The problem now is that if I toggle open the next one on the page, it resets the self test in the other open toggle. I want to ensure that the test resets only if the div containing the self test is toggled closed, not when the next one is toggled open.

Is there a way to say "reset the self test only if the div it's in is toggled closed, but not if another div is toggled open"?

jQuery: $("h2.titleTrigger").click(function(e){ e.preventDefault();

//TOGGLE OPEN/CLOSE THE DRAWER
$(this).toggleClass("active").next().slideToggle("fast");

//UNDO THE SELF TEST
$('.selfTestWrong').removeClass('answerShown');
$('input:radio').prop('checked', false);
$('.selfTestAnswer').slideUp(300);

return false;
});

//self test

$('input:radio').bind('change',function(e){
e.preventDefault();
var parentId = $(this).parents('.selfTest').attr('id');
$('#'+parentId+' .selfTestWrong').addClass('answerShown');
$('#'+parentId+' .selfTestAnswer').slideDown(300);
});

jsFiddle

Upvotes: 0

Views: 145

Answers (1)

tymeJV
tymeJV

Reputation: 104785

Make these changes:

//TOGGLE OPEN/CLOSE THE DRAWER
$(this).toggleClass("active").next().slideToggle("fast");
$(this).next().children(".selfTest").children(".selfTestWrong").removeClass("answerShown");
$(this).next().children(".selfTest").children("input:radio").prop("checked", false);
$(this).next().children(".selfTest").children(".selfTestAnswer").slideUp(300);

This finds the closest inputs in the selected div. Here's an updated fiddle: http://jsfiddle.net/bY7jp/3/

Upvotes: 1

Related Questions