In this article I will explain how to clear Dropdown
list and Textbox using JQuery in ASP.NET.
In this scenario I have created one Dropdown list
and one Textbox for user information. User clicks the Clear button Dropdown
list and Textbox values are cleared.
Clear Dropdown and Textbox values using
JQuery.
<script type="text/javascript">
$(function () {
$('#btnFirst').click(function ()
{
$('#txtFirstName').val('');
$('#ddlSelect').val('0');
})
})
</script>
Total
Page design code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Clear Textbox using jQuery</title>
<script src="http://code.jquery.com/jquery-1.8.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#btnFirst').click(function ()
{
$('#txtFirstName').val('');
$('#ddlSelect').val('0');
})
})
</script>
</head>
<body>
<div>
<form id="hdjfh" runat="server">
<table>
<tr>
<td><b>Enter First Name:</b></td>
<td>
<asp:TextBox runat="server" ID="txtFirstName" /></td>
</tr>
<tr>
<td><b>Select Rank:</b></td>
<td>
<asp:DropDownList runat="server" ID="ddlSelect" width="200px">
<asp:ListItem Text="Select" Value="0"></asp:ListItem>
<asp:ListItem Text="First" Value="1"></asp:ListItem>
<asp:ListItem Text="Secound" Value="2"></asp:ListItem>
<asp:ListItem Text="3rd" Value="3"></asp:ListItem>
</asp:DropDownList></td>
</tr>
<tr>
<td>
<b>Clear TextBoxes</b>
</td>
<td>
<asp:Button ID="btnFirst" runat="server" Text="Clear" />
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
Output:
No comments:
Post a Comment