Wednesday, 14 August 2013

JQuery Dropdown List Example

JQuery Dropdown List Example
<html>
<head>
<script src="jquery.js"></script>
<script>

$(document).ready(function() {
//To clear the selected item from the list
   $("#bt").click(function() {
     $("#selId option").attr("selected",false);
   });

//To get the value of selected item
   $("#bt1").click(function() {
     var temp=$("#selId option:selected").val();
     alert(temp);
   });

//To get the text of selected item
   $("#bt2").click(function() {
     var temp=$("#selId option:selected").text();
     alert(temp);
   });

//To get the index of selected item
   $("#bt3").click(function() {
     var temp=$("#selId option:selected").index();
     alert(temp);
   });

});

</script>
</head>
<body>
<select id="selId">
<option value="">---select---</option>
<option value="java">JAVA</option>
<option value="c">C</option>
<option value="c++">C++</option>
<option value="oracle">ORACLE</option>
</select>
<button id="bt">clear</button>
<button id="bt1">selectedValue</button>
<button id="bt2">selectedText</button>
<button id="bt3">selectedIndex</button>
</body>
</html>

No comments:

Post a Comment