Displaying conditional Fields in HTML Using A Form Select Menu
11,256
Change your select options to this
<option value="1">General Admission</option>
<option value="2">General Admission School</option>
and the javascript line to get the selected value should be like this
var selected = $("#generalAdmissionList option:selected").val();
Author by
Derek O Brien
Updated on June 06, 2022Comments
-
Derek O Brien almost 2 years
I am trying to get my page to display different form elements depending on which option is selected from the select menu but i can not get it to work for me
my HTML is
<h3>Register For General Admission</h3> <form action="GeneralRegister" method="POST" style="text-align:center"> Type Of Ticket: <select name="typeofticket" size="1" id="generalAdmissionList"> <option value="1"></option> <option value="1">General Admission</option> <option value="1">General Admission School</option> </select> <br> <div id="1"> <!--for general admission--> First name: <input type="text" name="firstname"> <br>Last name: <input type="text" name="lastname"> <br> </div> <div id="2"> <!--For Schools--> School name: <input type="text" name="school"> <br> </div> Email: <input type="text" name="email"> <br> <input type="submit" value="Submit"> <br> </form>
and my JavaScript is
$("#generalAdmissionList").change(function () { var selected = $("#generalAdmissionList option:selected").form(); $('div').hide(); $('#' + selected).show(); }); $(document).ready(function (e) { $('div').hide(); });
any help would be great
-
Derek O Brien about 10 yearsThank you.. fixed it straight away.. its bin bugging me for the last few hours and just couldn't find what i was doing wron