Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Bind data to Asp.net text box using dropdownlist in jquery

Title: JQuery set Text Box value in asp.net

Description:
In recent articles we known how to implement the  Data binding concept on data  controls like grid view,Data list,list etc.Here i would like to explain how to bind data to asp.net text box while leave the focus on Drop Down List using JQuery blur function.The blur function will fire when the previous controls has lost focus.

Example:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bind data to Asp.net text box using DropDownList in jquery</title>
</head>
<script type="text/javascript" src="~/jquery.min.js" ></script>
<script>
$(document).ready(function() {
$("#ddlSalesOrder").blur(function(){
var SalesOrderText = $("#ddlSalesOrder option:selected").text();
alert(SalesOrderText);
$("#<%= txtOrderTotalAmt.ClientID %>".val(SalesOrderText);
});
});
</script>
</head>
<body>
Amount: <asp:DropDownList ID="ddlSalesOrder" runat="server">
<asp:ListItem>100</asp:ListItem>
<asp:ListItem>125</asp:ListItem>
<asp:ListItem>150</asp:ListItem>
<asp:ListItem>175</asp:ListItem>
<asp:ListItem>200</asp:ListItem>
</asp:DropDownList>
TotalAmount:<asp:TextBox ID="txtOrderTotalAmt" runat="server"></asp:TextBox>
</body>
</html>
As you can see there is alert to confirmation for drop down selected value will come when the blur event occurs.Whenever we are using JQuery ,we should add JQuery library reference to our application.
In the above example we have taken one drop down list and text box to display the amount order .When the amount Drop down list has lost the focus ,the total Amount will be populate automatically.



This post first appeared on Aspdotnet-Sharepoint, please read the originial post: here

Share the post

Bind data to Asp.net text box using dropdownlist in jquery

×

Subscribe to Aspdotnet-sharepoint

Get updates delivered right to your inbox!

Thank you for your subscription

×