jquery - Show/hide divs based on radio button selections -
i trying create short yes or no radio button jquery quiz shows answered div upon submit.
after person has answered yes/no 3 questions , hit 'submit', answer show beneath quiz. if answer 'yes' of questions, show '#yes' option. if answer 'no' of questions, show 'no' option. can't figure out.
<div style="margin: 25px 0px 0px 50px;"> <form name="surveydemoform" type="external" action="" method="post" onsubmit="return onsubmitform();"> business need ability collect payments vendors?<br/><br/> <input type="radio" name="question-1" value="yes" id="q1-a">yes <input type="radio" name="question-1" value="no" id="q1-b">no<br/><br/><br/> need make, in rolling 3 business days, payments more aggregate amount of $75,000?<br/><br/> <input type="radio" name="question-2" value="yes" id="q2-a">yes <input type="radio" name="question-2" value="no" id="q2-b">no<br/><br/><br/> need account access more 10 additional users?<br/><br/> <input type="radio" name="question-3" value="yes" id="q3-a">yes <input type="radio" name="question-3" value="no" id="q3-b">no<br/><br/><br/> <input type="submit" id="submit" value="submit"> </form> </div> <div> <p id="yes"><a href="#">cash manager onine</a></p> <p id="no"><a href="#">small business online</a></p> </div> <script type="text/javascript"> $(function() { var rules = ['q1-a,q2-a,q3-a'] $('#submit').click(function() { $('#yes,#no').hide(); if( $('input[name=question-1]:checked').map(function(i,v) { return v.id; }).get().join(',') == rules[0] ) { $("#yes").show(); } else { $("#no").show(); } }); }); </script>
there's bunch of ways that, since logic simple literal approach find :checked inputs, , iterate on them see if need apply "no" case.
Comments
Post a Comment