{"id":22,"date":"2023-08-25T17:22:16","date_gmt":"2023-08-25T17:22:16","guid":{"rendered":"\/\/api.jquery.com\/?p=22"},"modified":"2024-04-20T18:06:30","modified_gmt":"2024-04-20T18:06:30","slug":"ajaxError","status":"publish","type":"post","link":"https:\/\/api.jquery.com\/ajaxError\/","title":{"rendered":"ajaxError event"},"content":{"rendered":"<article id=\"on1\" class=\"entry method\"><h2 class=\"section-title\">\n<span class=\"name\">.on( \"ajaxError\", handler )<\/span><span class=\"returns\">Returns: <a href=\"http:\/\/api.jquery.com\/Types\/#jQuery\">jQuery<\/a><\/span>\n<\/h2>\n<div class=\"entry-wrapper\">\n<p class=\"desc\"><strong>Description: <\/strong>Register a handler to be called when Ajax requests complete with an error. This is an <a href=\"\/Ajax_Events\/\">Ajax Event<\/a>.<\/p>\n<ul class=\"signatures\"><li class=\"signature\">\n<h4 class=\"name\">\n<span class=\"version-details\">version added: <a href=\"\/category\/version\/1.7\/\">1.7<\/a><\/span><a id=\"on-&quot;ajaxError&quot;-handler\" href=\"#on-%22ajaxError%22-handler\"><span class=\"icon-link\"><\/span>.on( \"ajaxError\", handler )<\/a>\n<\/h4>\n<ul>\n<li id=\"on-&quot;ajaxError&quot;-handler-&quot;ajaxError&quot;\">\n<div><strong>\"ajaxError\"<\/strong><\/div>\n<div>Type: <a href=\"http:\/\/api.jquery.com\/Types\/#string\">string<\/a>\n<\/div>\n<div>The string <code>\"ajaxError\"<\/code>.<\/div>\n<\/li>\n<li id=\"on-&quot;ajaxError&quot;-handler-handler\">\n<div><strong>handler<\/strong><\/div>\n<div>Type: <a href=\"http:\/\/api.jquery.com\/Types\/#Function\">Function<\/a>( <a href=\"http:\/\/api.jquery.com\/Types\/#Event\">Event<\/a> event, <a href=\"http:\/\/api.jquery.com\/Types\/#jqXHR\">jqXHR<\/a> jqXHR, <a href=\"http:\/\/api.jquery.com\/Types\/#PlainObject\">PlainObject<\/a> ajaxSettings, <a href=\"http:\/\/api.jquery.com\/Types\/#String\">String<\/a> thrownError )<\/div>\n<div>The function to be invoked.<\/div>\n<\/li>\n<\/ul>\n<\/li><\/ul>\n<div class=\"longdesc\" id=\"entry-longdesc\">\n    <div class=\"warning\">\n      <p>This page describes the <code>ajaxError<\/code> event. For the deprecated <code>.ajaxError()<\/code> method, see <a href=\"\/ajaxError-shorthand\/\"><code>.ajaxError()<\/code><\/a>.<\/p>\n    <\/div>\n    <p>Whenever an Ajax request completes with an error, jQuery triggers the <code>ajaxError<\/code> event. Any and all registered <code>ajaxError<\/code> handlers are executed at this time. <strong>Note:<\/strong> <em>This handler is not called for cross-domain script and cross-domain JSONP requests.<\/em><\/p>\n    <p>To observe this method in action, set up a basic Ajax load request.<\/p>\n    <div class=\"syntaxhighlighter xml\">\n\t<table>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t\n\t\t\t\t<td class=\"gutter\">\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n1\">1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n2\">2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n3\">3<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t<td class=\"code\">\n\t\t\t\t\t<pre><div class=\"container\"><div class=\"line\"><code><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"trigger\"<\/span>&gt;<\/span>Trigger<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span><\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"result\"<\/span>&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"log\"<\/span>&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n    <p>Attach the event handler to the document:<\/p>\n    <div class=\"syntaxhighlighter javascript\">\n\t<table>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t\n\t\t\t\t<td class=\"gutter\">\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n1\">1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n2\">2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n3\">3<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t<td class=\"code\">\n\t\t\t\t\t<pre><div class=\"container\"><div class=\"line\"><code>$( <span class=\"hljs-built_in\">document<\/span> ).on( <span class=\"hljs-string\">\"ajaxError\"<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>  $( <span class=\"hljs-string\">\".log\"<\/span> ).text( <span class=\"hljs-string\">\"Triggered ajaxError handler.\"<\/span> );<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>} );<\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n    <p>Now, make an Ajax request using any jQuery method:<\/p>\n    <div class=\"syntaxhighlighter javascript\">\n\t<table>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t\n\t\t\t\t<td class=\"gutter\">\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n1\">1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n2\">2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n3\">3<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t<td class=\"code\">\n\t\t\t\t\t<pre><div class=\"container\"><div class=\"line\"><code>$( <span class=\"hljs-string\">\"button.trigger\"<\/span> ).on( <span class=\"hljs-string\">\"click\"<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\"><\/span>) <\/span>{<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>  $( <span class=\"hljs-string\">\"div.result\"<\/span> ).load( <span class=\"hljs-string\">\"ajax\/missing.html\"<\/span> );<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>} );<\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n    <p>When the user clicks the button and the Ajax request fails, because the requested file is missing, the log message is displayed.<\/p>\n    <p>All <code>ajaxError<\/code> handlers are invoked, regardless of what Ajax request was completed. To differentiate between the requests, use the parameters passed to the handler. Each time an <code>ajaxError<\/code> handler is executed, it is passed the event object, the <code>jqXHR<\/code> object (prior to jQuery 1.5, the <code><abbr title=\"XMLHttpRequest\">XHR<\/abbr><\/code> object), and the settings object that was used in the creation of the request. When an HTTP error occurs, the fourth argument (<code>thrownError<\/code>) receives the textual portion of the HTTP status, such as \"Not Found\" or \"Internal Server Error.\" For example, to restrict the error callback to only handling events dealing with a particular URL:<\/p>\n    <div class=\"syntaxhighlighter javascript\">\n\t<table>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t\n\t\t\t\t<td class=\"gutter\">\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n1\">1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n2\">2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n3\">3<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n4\">4<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n5\">5<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t<td class=\"code\">\n\t\t\t\t\t<pre><div class=\"container\"><div class=\"line\"><code>$( <span class=\"hljs-built_in\">document<\/span> ).on( <span class=\"hljs-string\">\"ajaxError\"<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\"> event, jqxhr, settings, thrownError <\/span>) <\/span>{<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>  <span class=\"hljs-keyword\">if<\/span> ( settings.url == <span class=\"hljs-string\">\"ajax\/missing.html\"<\/span> ) {<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>    $( <span class=\"hljs-string\">\"div.log\"<\/span> ).text( <span class=\"hljs-string\">\"Triggered ajaxError handler.\"<\/span> );<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>  }<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>} );<\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n  <\/div>\n<h3>Additional Notes:<\/h3>\n<div class=\"longdesc\"><ul>\n<li>\n\t\t\tAs of jQuery 1.9, all the handlers for the <a href=\"\/category\/ajax\/global-ajax-event-handlers\/\">jQuery global Ajax events<\/a>, including those added with <code>.on( \"ajaxError\", ... )<\/code>, <em>must<\/em> be attached to <code>document<\/code>.\n\t\t<\/li>\n<li>\n\t\t\tIf <code><a href=\"\/jQuery.ajax\/\">$.ajax()<\/a><\/code> or <code><a href=\"\/jQuery.ajaxSetup\/\">$.ajaxSetup()<\/a><\/code> is called with the <code>global<\/code> option set to <code>false<\/code>, the <code>ajaxError<\/code> event will not fire.\n\t\t<\/li>\n<\/ul><\/div>\n<section class=\"entry-examples\" id=\"entry-examples\"><header><h2>Example:<\/h2><\/header><div class=\"entry-example\" id=\"example-0\">\n<p>Show a message when an Ajax request fails.<\/p>\n<div class=\"syntaxhighlighter javascript\">\n\t<table>\n\t\t<tbody>\n\t\t\t<tr>\n\t\t\t\t\n\t\t\t\t<td class=\"gutter\">\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n1\">1<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n2\">2<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"line n3\">3<\/div>\n\t\t\t\t\t\n\t\t\t\t<\/td>\n\t\t\t\t\n\t\t\t\t<td class=\"code\">\n\t\t\t\t\t<pre><div class=\"container\"><div class=\"line\"><code>$( <span class=\"hljs-built_in\">document<\/span> ).on( <span class=\"hljs-string\">\"ajaxError\"<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\"> event, request, settings <\/span>) <\/span>{<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>  $( <span class=\"hljs-string\">\"#msg\"<\/span> ).append( <span class=\"hljs-string\">\"&lt;li&gt;Error requesting page \"<\/span> + settings.url + <span class=\"hljs-string\">\"&lt;\/li&gt;\"<\/span> );<\/code><\/div><\/div><div class=\"container\"><div class=\"line\"><code>} );<\/code><\/div><\/div><\/pre>\n\t\t\t\t<\/td>\n\t\t\t<\/tr>\n\t\t<\/tbody>\n\t<\/table>\n<\/div>\n\n<\/div><\/section>\n<\/div><\/article>","protected":false},"excerpt":{"rendered":"<p>Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,78,96],"tags":[],"class_list":["post-22","post","type-post","status-publish","format-standard","hentry","category-global-ajax-event-handlers","category-78","category-96"],"_links":{"self":[{"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/posts\/22","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/comments?post=22"}],"version-history":[{"count":2,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/posts\/22\/revisions"}],"predecessor-version":[{"id":718,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/posts\/22\/revisions\/718"}],"wp:attachment":[{"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/media?parent=22"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/categories?post=22"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/api.jquery.com\/wp-json\/wp\/v2\/tags?post=22"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}