Browse Source

Added Ajax Error Handling

Added an error message when an ajax error occurs. This can be
overridden through the select2 option “formatAjaxError”.
Ermish 11 years ago
parent
commit
b505601629
2 changed files with 22 additions and 1 deletions
  1. 5 1
      select2.css
  2. 17 0
      select2.js

+ 5 - 1
select2.css

@@ -422,9 +422,9 @@ html[dir="rtl"] .select2-results {
     color: #000;
     color: #000;
 }
 }
 
 
-
 .select2-results .select2-no-results,
 .select2-results .select2-no-results,
 .select2-results .select2-searching,
 .select2-results .select2-searching,
+.select2-results .select2-ajax-error,
 .select2-results .select2-selection-limit {
 .select2-results .select2-selection-limit {
     background: #f4f4f4;
     background: #f4f4f4;
     display: list-item;
     display: list-item;
@@ -454,6 +454,10 @@ disabled look for disabled choices in the results dropdown
     background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%;
     background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%;
 }
 }
 
 
+.select2-results .select2-ajax-error {
+    background: rgba(255, 50, 50, .2);
+}
+
 .select2-more-results {
 .select2-more-results {
     background: #f4f4f4;
     background: #f4f4f4;
     display: list-item;
     display: list-item;

+ 17 - 0
select2.js

@@ -443,6 +443,16 @@ the specific language governing permissions and limitations under the Apache Lic
                         // TODO - replace query.page with query so users have access to term, page, etc.
                         // TODO - replace query.page with query so users have access to term, page, etc.
                         // added query as third paramter to keep backwards compatibility
                         // added query as third paramter to keep backwards compatibility
                         var results = options.results(data, query.page, query);
                         var results = options.results(data, query.page, query);
+                        query.callback(results);
+                    },
+                    error: function(jqXHR, textStatus, errorThrown){
+                        var results = {
+                            hasError: true,
+                            jqXHR: jqXHR,
+                            textStatus: textStatus,
+                            errorThrown: errorThrown,
+                        };
+
                         query.callback(results);
                         query.callback(results);
                     }
                     }
                 });
                 });
@@ -1766,6 +1776,12 @@ the specific language governing permissions and limitations under the Apache Lic
                     return;
                     return;
                 }
                 }
 
 
+                // handle ajax error
+                if(data.hasError !== undefined && checkFormatter(opts.formatAjaxError, "formatAjaxError")) {
+                    render("<li class='select2-ajax-error'>" + evaluate(opts.formatAjaxError, opts.element, data.jqXHR, data.textStatus, data.errorThrown) + "</li>");
+                    return;
+                }
+
                 // save context, if any
                 // save context, if any
                 this.context = (data.context===undefined) ? null : data.context;
                 this.context = (data.context===undefined) ? null : data.context;
                 // create a default choice and prepend it to the list
                 // create a default choice and prepend it to the list
@@ -3408,6 +3424,7 @@ the specific language governing permissions and limitations under the Apache Lic
         formatSelectionCssClass: function(data, container) {return undefined;},
         formatSelectionCssClass: function(data, container) {return undefined;},
         formatMatches: function (matches) { if (matches === 1) { return "One result is available, press enter to select it."; } return matches + " results are available, use up and down arrow keys to navigate."; },
         formatMatches: function (matches) { if (matches === 1) { return "One result is available, press enter to select it."; } return matches + " results are available, use up and down arrow keys to navigate."; },
         formatNoMatches: function () { return "No matches found"; },
         formatNoMatches: function () { return "No matches found"; },
+        formatAjaxError: function (jqXHR, textStatus, errorThrown) { return "Loading failed"; },
         formatInputTooShort: function (input, min) { var n = min - input.length; return "Please enter " + n + " or more character" + (n == 1? "" : "s"); },
         formatInputTooShort: function (input, min) { var n = min - input.length; return "Please enter " + n + " or more character" + (n == 1? "" : "s"); },
         formatInputTooLong: function (input, max) { var n = input.length - max; return "Please delete " + n + " character" + (n == 1? "" : "s"); },
         formatInputTooLong: function (input, max) { var n = input.length - max; return "Please delete " + n + " character" + (n == 1? "" : "s"); },
         formatSelectionTooBig: function (limit) { return "You can only select " + limit + " item" + (limit == 1 ? "" : "s"); },
         formatSelectionTooBig: function (limit) { return "You can only select " + limit + " item" + (limit == 1 ? "" : "s"); },