javascript - jQuery Show/Hide on a group of radio box shows then hides the div really fast -

javascript - jQuery Show/Hide on a group of radio box shows then hides the div really fast -

my code works beautfiully shows when need show , hides when need go away. thought here when using form person using can check box, see more required form info checked, makes fields required, , when user unchecks box goes away.

the problem when user clicks radio box within grouping radio box not have right value show container container (ex false condition) jquery quick show box, hide again. there way within code maintain box hidden if it's not right condition, , if switch different box, it'll hide box user looking at? if how?

here's code:

var hiddenclassarray = [ "appliedworkedyes", "workstudyyes", "workhistoryyes", "workweekendsyes", "cpryes", "aedyes", "aidyes", "lifegaurd", "wsiyes", "gaurdyes", "lifegaurdchk", "fitnesschk", "fitptcyes", "fitgrpyes", "outdooradvchk", "challengechk", "injurycarechk", "athtrainyes", "servicecenter", "itdepartmentchk", "marketingchk", "personaltrainer", "yogainstructr", "indoorcyclinginstructr", "grpfitinstruct", "pilatesinstructr", "itdepartmentchk", "marketingchk", "yogainstructr", "cyclinginstructr", "personaltrainerchk", "yogainstructorchk", "indoorcyclinginstructorchk", "grpfitinstructchk", "pilatesinstructchk", "itdepartmentchk2", "climbassistant", "priorwrkname", "priorwrksalary", "priorwrktitle", "priorwrksupervisor", "priorwrkstartdate", "priorwrkenddate", "priorwrkreasonforleaving", "officeusestatus" ]; // looping on each array element, hiding them using jquery for(var = 0; < hiddenclassarray.length; i++){ // jquery append display none. $("."+hiddenclassarray[i]+"hide").css("display","none"); } // ************ radio & check boxes ************ // jquery's equlivant of each loop, little fancier // appears work improve loop above, loop above // has no problems did set. $.each(hiddenclassarray, function(index, radio) { // first check box? if($("."+radio).is(':checkbox')) { // when click $("." + radio).click(function() { // if it's checked show if($("."+ radio).attr('checked')){ // show $("." + radio + "hide").show('fast'); // create 1 of grouping required $("."+ radio + "required").addclass("required"); } // default hide else{ // hide $("."+ radio + "hide").hide("fast"); // remove required class attribute $("."+ radio + "required").removeclass("required"); } }); // ends .click } // ends if // if it's radio box else if ($("."+radio).is(':radio')) { // on click $("."+radio).click(function(){ // show if($(this).val()==="true"){ // show $("."+radio + "hide").show("fast"); // create 1 of grouping required $("."+radio + "required").addclass("required"); alert("got here ! "); } else if($(this).val()=="nc"){ $("."+radio + "hide").show("fast"); } // default, hide else{ // hide $("."+radio + "hide").hide("fast"); // remove required class attribute $("."+radio + "required").removeclass("required"); } }); // emds .click }// ends else }); // end .each

try replace below code

$.each(hiddenclassarray, function(index, radio) {

// first check box? if($("."+radio).is(':checkbox')) { // when click $("." + radio).click(function() { // if it's checked show if($("."+ radio).is(':checked')){ // show $("." + radio + "hide").show(); // create 1 of grouping required $("."+ radio + "required").addclass("required"); } // default hide else{ // hide $("."+ radio + "hide").hide(); // remove required class attribute $("."+ radio + "required").removeclass("required"); } }); // ends .click } // ends if // if it's radio box else if ($("."+radio).is(':radio')) { // on click $("."+radio).click(function(){ // show if($(this).val()==="true"){ // show $("."+radio + "hide").show(); // create 1 of grouping required $("."+radio + "required").addclass("required"); alert("got here ! "); } else if($(this).val()=="nc"){ $("."+radio + "hide").show(); } // default, hide else{ // hide $("."+radio + "hide").hide(); // remove required class attribute $("."+radio + "required").removeclass("required"); } }); // emds .click }// ends else }); // end .each

javascript jquery