Friday, June 29, 2012

Asp.net jQuery DropDown set Selected Index


In this post, we will see on how to set the Selected Index of an Asp.net DropDownList control.

To set the Selected Index of an Asp.net DropDownList control, use the following code.
$('yourDropDown').prop("selectedIndex",yourIndex);


Here is a full example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        $('#cmdSetSelection').click(function(event)
        {
            event.preventDefault();
$('#drpCountry').prop("selectedIndex", 1);
  });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList><br /><br />
       
        <asp:Button ID="cmdSetSelection"
runat="server"
Text="SetSelection" />
    </div>
    </form>
</body>
</html>

Run the application and click the SetSelection button, notice that the United Kingdom option is selected. 





Related Posts


Posted by at 1 comments
Labels: , , , ,

Asp.net jQuery DropDown set Selected Value


In this post, we will see on how to set the Selected Value of an Asp.net DropDownList control.

To set the Selected Value of an Asp.net DropDownList control, use the following code.
$('yourDropDown').val('your value');


Here is a full example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        $('#cmdSetSelection').click(function(event)
        {
            event.preventDefault();
$('#drpCountry').val('UK');
  });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList><br /><br />
       
        <asp:Button ID="cmdSetSelection"
runat="server"
Text="SetSelection" />
    </div>
    </form>
</body>
</html>

Run the application and click the SetSelection button, notice that the United Kingdom option is selected. 





Related Posts
Posted by at 0 comments
Labels: , , , ,

Asp.net jQuery DropDown set Selected Text


In this post, we will see on how to set the Selected Text of an Asp.net DropDownList control.

To set the Selected Text of an Asp.net DropDownList control, use the following code.
$("#yourDropDown option:contains('your text')").attr('selected', 'selected');

Here is a full example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        $('#cmdSetSelection').click(function(event)
        {
            event.preventDefault();
$("#drpCountry option:contains('United Kingdom')").attr('selected', 'selected');        
  });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList><br /><br />
       
        <asp:Button ID="cmdSetSelection"
runat="server"
Text="SetSelection" />
    </div>
    </form>
</body>
</html>

Run the application and click the SetSelection button, notice that the United Kingdom option is selected. 





Related Posts
Posted by at 0 comments
Labels: , , , ,

Asp.net jQuery DropDown get Selected Text


In this post, we will see on how to get the Selected Text of an Asp.net DropDownList control.


To get the Selected Text of an Asp.net DropDownList control, use the following code.
$('#yourDropdown option:selected').text()


Here is a full example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        $('#cmdGetSelection').click(function(event)
        {
            event.preventDefault();
            alert('Selected Text : ' + $('#drpCountry
            option:selected' ).text());
       });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList><br /><br />
       
        <asp:Button ID="cmdGetSelection"
runat="server"
Text="GetSelection" />
    </div>
    </form>
</body>
</html>
Run the application and click the GetSelection button the output will be
Selected Value : United States






Related Posts
Posted by at 0 comments
Labels: , , , ,

Asp.net jQuery DropDown get Selected Value


In this post, we will see on how to get the Selected Value of an Asp.net DropDownList control.

To get the Selected Value of an Asp.net DropDownList control, use the following code.
$('#yourDropdown').val()

Here is a full example
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        $('#cmdGetSelection').click(function(event)
        {
            event.preventDefault();
            alert('Selected Value : ' + $('#drpCountry').val());
       });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList><br /><br />
       
        <asp:Button ID="cmdGetSelection"
runat="server"
Text="GetSelection" />
    </div>
    </form>
</body>
</html>

Run the application and click the GetSelection button the output will be
Selected Value : USA





Related Posts
Posted by at 0 comments
Labels: , , , ,
Subscribe to: Posts (Atom)