In this article I will explain how to handle errors and exceptions occurring in ASP.Net AJAX UpdatePanel control.
When AJAX UpdatePanel does Partial PostBack (AsyncPostBack) and some exception is thrown on the server side code, then the UpdatePanel will simply stuck and will not refresh and you will not see any error or exception from ASP.Net. Hence it is necessary to handle the ASP.Net AJAX UpdatePanel Exceptions and Errors.
 
 
The Problem
Browser displays a JavaScript error when using the ASP.Net AJAX UpdatePanel and it has to be displayed with some user friendly message for the website visitors.
ASP.Net AJAX UpdatePanel AsyncPostBack Error: Sys.WebForms.PageRequestManagerParserErrorException
 
 
Cause
AJAX is an asynchronous JavaScript call to the server and the same is done by ASP.Net AJAX UpdatePanel during its AsyncPostBack operation.
But when exception is thrown in server side code, it is caught by the ASP.Net AJAX UpdatePanel and it then throws the Sys.WebForms.PageRequestManagerParserErrorException JavaScript exception.
The following screenshot displays the line throwing the error caught from the server side code.
ASP.Net AJAX UpdatePanel AsyncPostBack Error: Sys.WebForms.PageRequestManagerParserErrorException
 
 
The Solution
Using few lines of JavaScript we can easily catch the errors thrown by the ASP.Net AJAX UpdatePanel and then display some user friendly message or simply suppress it.
HTML Markup
The below HTML Markup consists of a ScriptManager and a TextBox and a Button placed inside the ASP.Net AJAX UpdatePanel.
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel runat="server">
<ContentTemplate>
    <asp:TextBox ID="TextBox1" runat="server" Text="test" />
    <asp:Button runat="server" Text="Convert" OnClick="ConvertToInt" />
</ContentTemplate>
</asp:UpdatePanel>
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
    prm.add_endRequest(function (sender, e) {
        if (sender._postBackSettings.panelsToUpdate != null) {
            if (e.get_error() != null) {
                var ex = e.get_error();
                var mesg = "HttpStatusCode: " + ex.httpStatusCode;
                mesg += "\n\nName: " + ex.name;
                mesg += "\n\nMessage: " + ex.message;
                mesg += "\n\nDescription: " + ex.description;
                alert(mesg);
                e.set_errorHandled(true);
            }
        }
    });
};
</script>
 
Button Click event handler
The following event handler is triggered when the Button is clicked and it converts the TextBox’s string value to an Integer.
protected void ConvertToInt(object sender, EventArgs e)
{
    int number = Convert.ToInt32(TextBox1.Text);
}
 
Explanation
When the Button is clicked, the server side event handler tries to convert the TextBox value to an Integer value but when the string value is not a valid integer, it fails and an exception is thrown.
This exception is processed inside the ASP.Net AJAX UpdatePanel’s JavaScript endRequest event handler and is displayed using JavaScript alert message box.
Finally it is conveyed to the ASP.Net AJAX UpdatePanel that the error has been handled and must not be thrown using the set_errorHandled method.
ASP.Net AJAX UpdatePanel AsyncPostBack Error: Sys.WebForms.PageRequestManagerParserErrorException
In the above example, a JavaScript alert containing the details of the exception that occurred on server side is displayed, but the same can also be handled in the following ways.
1. Display the error message using some HTML SPAN or ASP.Net Label control.
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
    prm.add_endRequest(function (sender, e) {
        if (sender._postBackSettings.panelsToUpdate != null) {
            if (e.get_error() != null) {
                var ex = e.get_error();
                var mesg = "HttpStatusCode: " + ex.httpStatusCode;
                mesg += "<br />Name: " + ex.name;
                mesg += "<br />Message: " + ex.message;
                mesg += "<br />Description: " + ex.description;
                $get("<%=lblError.ClientID %>").innerHTML = mesg;
                e.set_errorHandled(true);
            }
        }
    });
};
</script>
 
2. Hide the error from the user and simply suppress it.
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
    prm.add_endRequest(function (sender, e) {
        if (sender._postBackSettings.panelsToUpdate != null) {
            if (e.get_error() != null) {
                e.set_errorHandled(true);
            }
        }
    });
};
</script>
 
 
Demo
 
 
Downloads