Get value from selected dropdown.
Most basic way is
|
1 2 3 4 |
var textboxvalue= $('#qualsearchbox option:selected').text(); alert(textboxvalue); |
There are two ways depending on of one page is being called inside another page.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<script> //first way $(document).ready(function() { $(document).on('change','#service',function() { alert("Hi"); }); }); //end ready </script> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
//second way <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <select name="CallBackTime" id="CallBackTime"> <option selected="selected">As soon as possible</option> <option value="9am">9:00am</option> <option value=”10am”>10:00am</option> <option value=”11am”>11:00am</option> </select> <script> $('#CallBackTime').change(function() { alert('Value change to ' + $(this).val()); }); </script> |
Another variation on this is: –
|
1 2 3 4 5 6 7 8 9 |
<script> $('#CallBackTime').change(function() { var dog = $(this).val() alert('Value change to ' + dog); }); </script> |
Get the text of the dropdown
|
1 2 3 4 5 6 7 8 9 |
<script> $('#secondbox').change(function() { var dog = $("#secondbox option:selected").text(); alert(dog); }); </script> |
This next code will show an amount of div you decide upon.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
<meta http-equiv="Content-Type" content="text/html"; charset="utf-8"> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <label>How many convictions have you had in the last 5 years?</label> <select name="CallBackTime" id="hidden-form"> <option selected="selected">please select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <script> $(document).ready(function() { $('#box1').hide(); $('#box2').hide(); $('#box3').hide(); $('#hidden-form').change(function() { var dog = $(this).val(); // alert('Value change to ' + dog); if (dog == "1") { // alert("hi"); $('#box1').show(); $('#box2').hide(); $('#box3').hide(); } if (dog == "2") { // alert("hi"); $('#box1').show(); $('#box2').show(); $('#box3').hide(); } if (dog == "3") { // alert("hi"); $('#box1').show(); $('#box2').show(); $('#box3').show(); } }); }); //end ready </script> <div id ="box1"> hi1 </div> <div id ="box2"> hi2 </div> <div id ="box3"> hi3 </div> |
