Thursday, December 15, 2011

Calling postback event from Javascript in asp.net

Postback is a concept introduced in ASP.NET and is a very handy method. Postback is built into the ASP.NET and .aspx web page support it without writing any statement.
There will be some case where you want to explicitly postback to the server using javascript. It is quite simple to do this.
ASP.NET already creates a client side javascript method as shown below to support Postbacks for the web server controls.

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}

So, what you have to do just call this method with appropriate arguments. You can call this as shown below.

<script language='Javascript'>
__doPostBack('__Page', 'YourCustomArgument');
</script>

However, it is not recommended to use this method name directly in the client side. The best approach is, generate this piece of code from the code behind file using ASP.NET. This way, you are safe even if Microsoft later change the name of the method '__doPostBack' to something else in a future release.

Now insert the following code in your .aspx page.

<script type="text/javascript">
    function Jpostback()
    {
        <%= PostBackStr %>
    }
</script>

At runtime, it will be evaluated as:

<script language=’Javascript’>
__doPostBack(‘__Page’, ‘MyCustomArgument’);
</script>

Here is form tag.

<form id="form1" runat="server">
        <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="Jpostback();" />
</form>

Remember to insert the above script into some Javascript method/event where you want to call the postback, instead of simply inserting into the page as shown above.

To identify and handle the postback in code behind, you need a way to identify your postback in the code behind file. The second argument the doPostback method becomes helpful here.

In your code-behind,

//declare a protected variable
protected string PostBackStr;

//In page load event
protected void Page_Load(object sender, EventArgs e)
{
    /*GetPostBackEventReference() will generate the same piece
    of client side code like __doPostBack that you need to use
    to call the Postback method. */
    PostBackStr = Page.ClientScript.GetPostBackEventReference
    (this, "MyCustomArgument");

    if (Page.IsPostBack)
    {
        String eventArg = Request["__EVENTARGUMENT"];
        if (eventArg == "MyCustomArgument")
        Response.Write("you got it");
    }   
}       

Whenever you press the Button, the page is loaded. To identify it is whether our postback or not, we used the second argument in the __doPostBack method to pass a value and used that in PageLoad to identify (here is "MyCustomArgument").

Original post here

2 comments:

  1. You are stealing content from this article:

    http://www.dotnetspider.com/resources/1521-How-call-Postback-from-Javascript.aspx

    I have notified the authors of the original article. I suggest you take down this stolen content.

    ReplyDelete
    Replies
    1. Sorry about that. I forgot the giving credit. Thank.

      Delete