Using JQuery to display a hidden div with slideup and slidedown

cookingkay1955

New Member
I have made this form to let certain options appear when the user selects 'Yes' from my select form. I cannot get the div I have hidden to display at all, but I have used the Console and found that at least changing the select to yes does infact make my if statement run. I've ran a test and JQuery is working, but Can anyone help me identify where I am going wrong?\[code\] <form method="post" action="quizcreatescript.php" name="quizcreateform" id="quizcreateform"> <select name="choosemarks" id="choosemarks"> <option value="http://stackoverflow.com/questions/14444897/noweights">No</option> <option value="http://stackoverflow.com/questions/14444897/yesweights">Yes</option> </select><!-- >This div is hidden until the user selects yes to add own marks<--> <div class="hide" id="hiddendiv1"><!-- this select box will be hidden at first --><div class="input select"> <input type="text" name="quizcorrectaward" id="quizcorrectaward"><br> <input type="text" name="quizincorrectaward" id="quizincorrectaward"><br> </div> </div><script type="text/javascript"> $("#choosemarks").change(function(){ // when #choosemarks changes if ($(this).val() == "yesweights" ) { // if user selects to add own marks $(".hiddendiv1").slideDown("fast"); // if yes show the hidden div } else { $(".hiddendiv1").slideUp("fast"); //otherwise, hide the div again. } });</script> <input type="submit" name="createthequiz" id="createquiz" value="http://stackoverflow.com/questions/14444897/Create Quiz"> </form>\[/code\]And the CSS form has\[code\].hide { display:none;}\[/code\]
 
Back
Top