DropDown List Example in JQuery

  1. <html>  
  2.   
  3. <head>  
  4.     <title></title>  
  5.     <script src="Scripts/jquery-2.1.1.js" type="text/javascript"></script>  
  6.     <script type="text/javascript">  
  7.     $(document)  
  8.         .ready(function()  
  9.         {  
  10.             $("#btn1")  
  11.                 .click(function()  
  12.                 {  
  13.                     var value = $("#ddl1 option:selected")  
  14.                         .val();  
  15.                     var txt = $("#ddl1 option:selected")  
  16.                         .text();  
  17.                     $("#ddl1 option[value=Opt2]")  
  18.                         .prop("disabled"true);  
  19.                     if (value != "Select")  
  20.                     {  
  21.                         alert("Select option:" + "\n" + "value:" + value + "\n" + "text:" + txt);  
  22.                     }  
  23.                     else  
  24.                     {  
  25.                         alert("Please select any one");  
  26.                     }  
  27.                 });  
  28.         });  
  29.     </script>  
  30. </head>  
  31.   
  32. <body>  
  33.     <form id="form1" runat="server">  
  34.         <div>  
  35.             <b>Select Option:</b>  
  36.             <asp:DropDownList ID="ddl1" runat="server">  
  37.                 <asp:ListItem Text="Select" Value="Select" />  
  38.                 <asp:ListItem Text="Option1" Value="Opt1" />  
  39.                 <asp:ListItem Text="Option2" Value="Opt2" />  
  40.                 <asp:ListItem Text="Option3" Value="opt3" />  
  41.             </asp:DropDownList>  
  42.             <input type="button" id="btn1" value="Submit" />  
  43.         </div>  
  44.     </form>  
  45. </body>  
  46.   
  47. </html>