jquery - Dynamic Page Based On Dropdown Selection -
i working on sign system. there different prices different membership types. associate $25, family $40, regular $35, regular family $40, honary $0, , institutional $25. need dropdown menu change amount due based on membership selected.
my code right now:
<p>current status: <select name="status_current"> <option value="">please select</option> <option value="a">associate</option> <option value="f">family</option> <option value="r">regular</option> <option value="rf">regular family</option> <option value="h">honary</option> <option value="i">institutional</option> </select> </p>
first, include jquery in page, this:
<head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> </head>
i use jquery this:
$('#dropdownid').val();
or selected text:
$('#dropdownid :selected').text();
i make function runned when user changes option.
<p>current status: <select id="dropdownid" name="status_current" onchange=yourfunction()> <option value="">please select</option> <option value="a">associate</option> <option value="f">family</option> <option value="r">regular</option> <option value="rf">regular family</option> <option value="h">honary</option> <option value="i">institutional</option> </select></p>
then javascript function like:
<script type="text/javascript"> function yourfunction(){ if($('#dropdownid').val()=="a"){ $("#div_to_show_the_price").html("25$"); } else if($('#dropdownid').val()=="f"){ $("#div_to_show_the_price").html("40$"); } } </script> <div id="div_to_show_the_price"></div>
and on other options.
Comments
Post a Comment