Last active
December 14, 2015 11:50
-
-
Save ksafranski/5082377 to your computer and use it in GitHub Desktop.
A simple, library-independent ajax function
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Library-Independent AJAX Function | |
| * | |
| * Usage: | |
| * -------------------------------- | |
| * | |
| * ajax(url, { ...properties... }); | |
| * -or- | |
| * ajax({ ...properties... }); | |
| * | |
| * Example: | |
| * -------------------------------- | |
| * | |
| * ajax({ | |
| * url: 'path/to/resource', | |
| * type: 'POST', | |
| * async: true, | |
| * cache: true, | |
| * data: { foo: 'bar', baz: 'qux' }, | |
| * success: function(data, request){ | |
| * ...actions on success... | |
| * }, | |
| * error: function(request){ | |
| * ...actions on error... | |
| * } | |
| * }); | |
| * | |
| */ | |
| function ajax() { | |
| "use strict"; | |
| /** | |
| * Parent object for all parameters | |
| */ | |
| var xhr = {}; | |
| /** | |
| * Determine call structure | |
| * ajax(url, { params }); or ajax({ params }); | |
| */ | |
| if (arguments.length === 1) { | |
| // All params passed as object | |
| xhr = arguments[0]; | |
| } else { | |
| // Populate xhr obj with second argument | |
| xhr = arguments[1]; | |
| // Add first argument to xhr object as url | |
| xhr.url = arguments[0]; | |
| } | |
| /** | |
| * Parameters & Defaults | |
| */ | |
| xhr.request = false; | |
| xhr.type = xhr.type || "GET"; | |
| xhr.data = xhr.data || null; | |
| if (xhr.cache || !xhr.hasOwnProperty("cache")) { xhr.cache = true; } else { xhr.cache = false; } | |
| if (xhr.async || !xhr.hasOwnProperty("async")) { xhr.async = true; } else { xhr.async = false; } | |
| if (xhr.success && typeof xhr.success === "function") { xhr.success = xhr.success; } else { xhr.success = false; } | |
| if (xhr.error && typeof xhr.error === "function") { xhr.error = xhr.error; } else { xhr.error = false; } | |
| /** | |
| * Format xhr.data & encode values | |
| */ | |
| if (xhr.data) { | |
| var param_count = 0, | |
| name, | |
| value, | |
| tmp_data = xhr.data; | |
| for (var param in tmp_data) { | |
| if(tmp_data.hasOwnProperty(param)){ | |
| name = encodeURIComponent(param); | |
| value = encodeURIComponent(tmp_data[param]); | |
| if (param_count === 0) { | |
| xhr.data = name + "=" + value; | |
| } else { | |
| xhr.data += "&" + name + "=" + value; | |
| } | |
| param_count++; | |
| } | |
| } | |
| xhr.data = xhr.data; | |
| } | |
| /** | |
| * Appends data to URL | |
| * @string data The data to append | |
| */ | |
| function formatURL(data) { | |
| var url_split = xhr.url.split("?"); | |
| if (url_split.length !== 1) { | |
| xhr.url += "&" + data; | |
| } else { | |
| xhr.url += "?" + data; | |
| } | |
| } | |
| /** | |
| * Handle xhr.data on GET request type | |
| */ | |
| if (xhr.data && xhr.type.toUpperCase() === "GET") { | |
| formatURL(xhr.data); | |
| } | |
| /** | |
| * Check cache parameter, set URL param | |
| */ | |
| if (!xhr.cache) { | |
| formatURL(new Date().getTime()); | |
| } | |
| /** | |
| * Establish request | |
| */ | |
| if (window.XMLHttpRequest) { | |
| // Modern non-IE | |
| xhr.request = new XMLHttpRequest(); | |
| } else if (window.ActiveXObject) { | |
| // Internet Explorer | |
| xhr.request = new ActiveXObject("Microsoft.XMLHTTP"); | |
| } else { | |
| // No request object, break | |
| return false; | |
| } | |
| /** | |
| * Monitor ReadyState | |
| */ | |
| xhr.request.onreadystatechange = function () { | |
| if (xhr.request.readyState === 4) { | |
| if (xhr.request.status === 200) { | |
| if (xhr.success) { | |
| // Returns responseText and request object | |
| xhr.success(xhr.request.responseText, xhr.request); | |
| } | |
| } else { | |
| if (xhr.error) { | |
| // Returns request object | |
| xhr.error(xhr.request); | |
| } | |
| } | |
| } | |
| }; | |
| /** | |
| * Open Http Request connection | |
| */ | |
| xhr.request.open(xhr.type, xhr.url, xhr.async); | |
| /** | |
| * Set request header for POST | |
| */ | |
| if (xhr.type.toUpperCase() === "POST") { | |
| xhr.request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); | |
| } | |
| /** | |
| * Send data | |
| */ | |
| xhr.request.send(xhr.data); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Can this be used with the jsonp datatype?