Sunday, February 23, 2014

Jquery to Populate Drop Down List with Text Box value in ASP.Net

Leave a Comment
In this example I am showing how to populate the drop down list control of asp.net with the value entered in a text box control in jquery. In this example there is  a text box in which you enter some text and click on add  button , the value of text box would be appended into drop down list control.

HTML Code to Populate Drop Down List with Text Box Value:


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="//code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
 $(document).ready(function () {
 $('#add').click(function () {
 $('#drplist').append('<option>' + $('#item').val() + '</option>"');
 });
 });
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="item" runat="server">
</asp:TextBox>
<input type="button" name="name" value="add" id="add" />
<asp:DropDownList ID="drplist" runat="server">        
</asp:DropDownList>
</div>
</form>
</body>
</html>




0 comments:

Post a Comment