- clear search form without postback

Hello Experts,

.net 4.0,, c#, jquery

I have a search form that filters data in a gridview.  I currently have a clear button that when clicked clears the form (text boxes) and reloads the gridview.  The onclick of the clear button occurs in a postback.  I want to do this without a postback.  I am guessing I will have to use jquery to handle this.  

Here is what I am working with now:

        function ClearSearch() {

            //document.getElementById("txtSearch").value = "";
            $('#<%=txtSearch.ClientID %>').attr('value', ''); 
        <td align="right">
            <asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
            <asp:Button ID="btnSearch" runat="server" height="26px" Text="Search" 
                onclick="btnSearch_Click" />
            <asp:Button ID="btnClear" runat="server" height="26px" Text="Clear"
                onclick="btnClear_Click" />                

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <asp:AsyncPostBackTrigger ControlID="btnFilter" />
        <asp:AsyncPostBackTrigger ControlID="btnSearch" />
        <asp:AsyncPostBackTrigger ControlID="btnClear" /> //<-- doesn't clear txtSearch
        <asp:GridView ID="gvResults" runat="server" 

    protected void btnClear_Click(object sender, EventArgs e)
        //clear search textbox and reset grid based on filter
        //clear only works on postback
        txtSearch.Text = string.Empty;
        gvResults.PageIndex = 0;

Open in new window

So, when the user clicks the clear button, I would like the Search text box (txtSearch) to be cleared and the gridview to be reloaded (gvResults.databind()).

Any help much appreciated.  Thanks in advance.
Who is Participating?
Rajar AhmedConnect With a Mentor ConsultantCommented:
try this,
 <script src="//" type="text/javascript"></script>
function ClearSearch() {
            //document.getElementById("txtSearch").value = "";
            $('#<%=txtSearch.ClientID %>').val(''); 
            return false;
<asp:Button ID="btnClear" runat="server" height="26px" Text="Clear"
                onclientclick="return ClearSearch();" /> 

Open in new window

Obadiah ChristopherCommented:
It should be return true;
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.