Click here to Skip to main content
13,803,077 members
Click here to Skip to main content
Add your own
alternative version


12 bookmarked
Posted 6 May 2011
Licenced CPOL

TimeOuts and Error Handling by jQuery in ASP.NET

, 6 May 2011
Rate this:
Please Sign up or sign in to vote.
Handling Errors and TimeOuts in ASP.NET by using jquery with the help of $.ajax() function

View Output

Output Image


By using Ajax, we can create rich, interactive Web based applications. With the help of jQuery, you can easily implement it in your Web pages. Using Ajax, you can communicate with server without page refresh, and this feature makes Web based applications like desktop applications.

But sometimes, we need to handle timeout and errors, because the resource you’re trying to download from the server may not be there, or there may be no connection to the Internet.

For this, we use the $.ajax() function, handle errors with a callback function that’s called when an error occurs. You connect the error callback function to the $.ajax() function using the error option and put error handling code into the callback function.

The error callback function is passed three items: the XMLHttpRequest object, a string that contains the error description, and an exception object.

In timeout section, the resource you’re trying to reach may not be available or Ajax response is very long. At this time, we can use a timeout option and provide time in milliseconds in the $.ajax() function.

The $.ajax() function has 20 options but according to the article, we use only 5 options to explain timeout and error handling.


OptionsData TypeDescription
typeStringThis option sets the type of request to make (POST or GET). The default is GET
urlStringThis option sets the URL to request
successFunctionThis function is called if the request succeeds. The function is passed two arguments: the data returned from the server and a string describing the status
timeoutNumberThis option sets a timeout (in milliseconds) for the request
errorFunctionThis function is called if the request fails. The function is passed three arguments: the XMLHttpRequest object, a string describing the type of error, and an exception object

Using the code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

<html xmlns="" >
<title>TimeOuts and Error Handling by jQuery in ASP.NET</title>
<script src="jquery-1.5.2.min.js"></script>
<style type="text/css">
td {font-weight:bold;background-color:#dd0000;color:#ffffff;border:solid 1px #000000;}
#td1,#td2,#td3 {font-weight:bold;background-color:#ffff99;color:#000000;
border:solid 1px #000000;}
#td4 {font-weight:bold;color:#dd0000;background-color:#ffffff;border:solid 1px #000000;}
<script type="text/javascript">	

// error and timeout handling by $.ajax() function 
function fajaxget(){$.ajax({type:"GET",url:"test.txt",
function fajaxgetwitherror(){$.ajax({type:"GET",url:"test1.txt",
function fajaxgetwithtimeerror(){$.ajax({type:"GET",url:"test.txt",

//callback function for success
function callbackg(data,status){$("#td1").html(data);}	
//callback function for error
function callerror(xhr,reason,ex){$("#td2").text(reason);}	
//callback function for timeout
function callerrorwt(xhr,reason,ex){$("#td3").text(reason);}	

<table cellpadding="3" cellspacing="3">
<tr><td>Ajax $.ajax() call with correct url with no error</td><td>
<input type="button" value="$.ajax()" onclick="javascript:fajaxget();" /></td>
<td id="td1"></td></tr>
<tr><td>Ajax $.ajax() call with wrong url to get error  </td><td>
<input type="button" value="$.ajax() for error " 

onclick="javascript:fajaxgetwitherror();" /></td><td id="td2"></td></tr>
<tr><td>Ajax $.ajax() for response to get timeout status<br/> 
</td><td><input type="button" value="$.ajax() for timeout" 

onclick="javascript:fajaxgetwithtimeerror();" /></td><td id="td3"></td></tr>
<tr><td id="td4" colspan ="3"><b>Note:</b>timeout status view in 
firefox browser and ie timeout status is blank. In firefox timeout status 
is not visible please click 3-5 times regular in on timeout buttons.

Points of Interest

If we make our web application with the use of jQuery and want to handle errors and delay responses problem, for this we always use error and timeout options in $.ajax() to do safe handling.


  • 5th May, 2011: Initial version


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

R S Dodiya
Technical Lead Wipro Ltd.
India India

You may also be interested in...

Comments and Discussions

GeneralMy vote of 1 Pin
Selvin9-May-11 0:13
memberSelvin9-May-11 0:13 
GeneralMy vote of 5 Pin
Monjurul Habib7-May-11 4:53
professionalMonjurul Habib7-May-11 4:53 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Cookies | Terms of Use | Mobile
Web04 | 2.8.181215.1 | Last Updated 6 May 2011
Article Copyright 2011 by R S Dodiya
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid