Avoid postback on button click

Question

I have a Search feature. if the search string is empty and user clicks "GO" then the postback of the gridview shouldn't happen and the alert (as mentioned in below code) should get fired up.

My gridview is in update panel. Below is the logic that i have written but it doesn't works.

 protected void btnGo_Click(object sender, EventArgs e)
        {
            if (!txtSearchString.Text.Equals(string.Empty))
            {
                BinGrid();
                upnl1.update //update panel is updated here.
            }
            else
            {
                ScriptManager.RegisterStartupScript(this.upnl1, this.GetType(), "Search", "alert('Enter search text');", false);
                //upnlgvOpportinities.Update();
                //upnlAdmin.Update();
                return;
            }
        }

Please help! Let me know if any info is needed

The alert box comes succesfully but the postback still happens! — xorpower, Aug 31 '11 at 08:16

score 4 · Answer 1 · answered Aug 31 '11 at 07:27

This logic is wrong. It should do using javascript if you want to avoid the postback at first place.

Have your javascript return false when textbox is empty and true when not

<asp:button runat="server".... OnClientClick="return myfunction(); " />

You can check if textbox is empty or not in myfunction()

score 2 · Accepted Answer · answered Aug 31 '11 at 07:31

2

Replace Your ScriptManager line with below code line.

ScriptManager.RegisterStartupScript(this.upnl1, this.GetType(), "Script", "alert('Enter search text');", true);

answered Aug 31 '11 at 07:31

sikender

5,883
7
42
80

No it is not inside update panel. I guess now i need to remove the first argument – xorpower Aug 31 '11 at 08:11
Please, Place you button inside update panel. and then check it again.it will work. – sikender Aug 31 '11 at 08:13

score 2 · Answer 3 · answered Aug 31 '11 at 07:41

If you don't want a request to the server to be sent (if I understood your needs right), than you need a client-side solution, that is handle button click with javascript and conditionally prevent the postback. However your current code is server-side, and is executed on a server after the postback has occurred.

As to client-side, here is one possible way. Define a js function that simply checks the value of the search box and returns false if it is empty. On the button click simply call this function. If a click handler returns false, further processing of the button click will be stopped and the postback won't occur:

function checkSearch() {
    var searchBox = document.getElementById('HereComesSearchBoxClientID');

    if (searchBox.value == '') {
        alert('Enter search text');
        return false;
    } else {
        return true;
    }
}

<asp:Button ID="SearchButton" runat="server" Text="GO" OnClick="ServerSideHandler" OnClientClick="checkSearch();" />

+1: please pass `this` so that you dont have to worry about client id — naveen, Sep 01 '11 at 05:46

score 0 · Answer 4 · answered Sep 01 '11 at 05:44

@Madhur Ahuja's way is the correct one. Expanding that a little bit more.

HTML

<asp:Button ID="txtSearchString" runat="server" 
        OnClientClick="javascript:return CheckifEmpty(this);" />

Javascript

function CheckifEmpty(objSearchBox) {
    //always trim, otherwise it will accept a string of spaces
    var isEmpty = objSearchBox.value.trim() == "";
    if (isEmpty) {
        alert('Enter search text');
    }
    return !isEmpty;
}
if (!String.prototype.trim) {
    String.prototype.trim = function() {
        return this.replace(/^\s*(\S*(?:\s+\S+)*)\s*$/, "$1");
    };
}

Avoid postback on button click

4 Answers4