In this example, we have a button and input text boxes in the form, we will clear all text boxes when user type any text in the text boxes it can be clear through clear form button.
Lets see the example
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#<%=Button1.ClientID %>").click(function (e) {
$("form input")
.not(':reset, :submit, :hidden, :button')
.val("");
return false;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
Name:<asp:TextBox ID="tbName" runat="server"></asp:TextBox></p>
<p>
Email Address:<asp:TextBox ID="tbemail" runat="server"></asp:TextBox></p>
<p>
Birthday:
<asp:TextBox ID="tbbirth" runat="server"></asp:TextBox></p>
<p>
Alternative Email Address<asp:TextBox ID="tbAltEmail" runat="server"></asp:TextBox></p>
<p>
<asp:Button ID="Button1" runat="server" Text="Clear form" />
<asp:Button ID="Button2" runat="server" Text="Submit" />
</p>
</div>
</form>
<p>
Author:Aamir Hasan
<br />
<a href="http://www.aspxtutorial.com">Free online asp.net tutorial</a>
</p>
</body>
</html>
As you can see, we have used val() function to clear the text from all boxes in the form
Note: Make sure that all input textboxes should be within the form tag.
Download
Clear-textbox.aspx (1.68 kb)
See live demo