Description:
One of my readers asked me one question that how can I set or
get values of server side elements using
JQuery. So I decided to write post for this.
It is possible with val()
function.
Using val()
To get the values of the control,
var getvalues = $("#ControlID").val();
To set the values to the control,
$("#ControlID").val("Assign values here");
If we want to get the selected element
of the dropdown controls, use option:selected
We can get the selected value of the dropdown controls by,
var selectedval = $('#DropDownID
option:selected').val();
We can get the selected text of the dropdown controls by,
var selectedtext
= $('#DropDownID option:selected').text();
Example program:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script
type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script
type="text/javascript">
$(document).ready(function () {
$("#btnGetValue").click(function () {
var
selectedval = $('#DropDownList1 option:selected').val();
var
selectedtext = $('#DropDownList1 option:selected').text();
var
name = $('#txtName').val();
alert("Dropdown
Selected Value: " + selectedval );
return
false;
});
$("#btnSetValue").click(function () {
$('#txtName').val("jqueryjohn.com");
return
false;
});
});
</script>
</head>
<body>
<form
id="form1"
runat="server">
<div>
<asp:Label ID="lblName" runat="server" Text="Enter Name:"></asp:Label>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem Value="1">One</asp:ListItem>
<asp:ListItem Value="2">Two</asp:ListItem>
<asp:ListItem Value="3">Three</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="btnGetValue" runat="server" Text="Get Dropdown Value" />
<asp:Button ID="btnSetValue" runat="server" Text="Set Textbox Value" />
</div>
</form>
</body>
</html>
Set Textbox
value using JQuery, How to set value of input text using jQuery, Getting value
from input control using jQuery, Get selected text from dropdownlist using
jQuery, Getting text value for a dropdown list, How to get the values of the
control, get dropdown selected value using Jquery