ajax.js 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. function AjaxErrorBadStatusCode(message) { this.name = 'AjaxErrorBadStatusCode'; this.message = message; };
  2. AjaxErrorBadStatusCode.prototype = new Error();
  3. var ajax = {loaded: false};
  4. ajax.create = function() {
  5. if(typeof XMLHttpRequest !== 'undefined') {
  6. return new XMLHttpRequest();
  7. };
  8. var versions = [
  9. "MSXML2.XmlHttp.6.0",
  10. "MSXML2.XmlHttp.5.0",
  11. "MSXML2.XmlHttp.4.0",
  12. "MSXML2.XmlHttp.3.0",
  13. "MSXML2.XmlHttp.2.0",
  14. "Microsoft.XmlHttp"
  15. ];
  16. var xhr;
  17. for(var i = 0; i < versions.length; i++) {
  18. try {
  19. xhr = new ActiveXObject(versions[i]);
  20. break;
  21. } catch(e) {
  22. // Silent
  23. };
  24. };
  25. return xhr;
  26. };
  27. ajax.send = function(url, callback, method, data, async) {
  28. if(async === undefined) {
  29. async = true;
  30. };
  31. var a = ajax.create();
  32. a.open(method, url, async);
  33. a.onreadystatechange = function() {
  34. // a.readyState:
  35. // 0 - UNSENT
  36. // 1 - OPENED
  37. // 2 - HEADERS_RECEIVED
  38. // 3 - LOADING
  39. // 4 - DONE
  40. callback(method, data, a.readyState, a.status, a.responseText);
  41. };
  42. if(method == 'POST') {
  43. a.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  44. };
  45. a.send(data);
  46. };
  47. ajax.get = function(url, data, callback, async) {
  48. var query = [];
  49. for(var key in data) {
  50. query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
  51. };
  52. ajax.send(url + (query.length ? '?' + query.join('&') : ''), callback, 'GET', null, async);
  53. };
  54. ajax.getJSON = function(url, data, callbackSuccess, callbackError, async) {
  55. ajax.get(url, data, function(method, data, readyState, status, responseText) {
  56. if(readyState == 4) {
  57. if(status == 200) {
  58. try {
  59. var r = JSON.parse(responseText);
  60. if(callbackSuccess) {
  61. callbackSuccess(method, data, readyState, status, r);
  62. };
  63. } catch(e) {
  64. if(callbackError) {
  65. callbackError(method, data, readyState, status, e);
  66. };
  67. };
  68. } else {
  69. if(callbackError) {
  70. var e = new AjaxErrorBadStatusCode('Bad status code '+status);
  71. callbackError(method, data, readyState, status, e);
  72. };
  73. };
  74. };
  75. }, async);
  76. };
  77. ajax.post = function(url, data, callback, async) {
  78. var query = [];
  79. for (var key in data) {
  80. query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
  81. };
  82. ajax.send(url, callback, 'POST', query.join('&'), async);
  83. };
  84. ajax.postJSON = function(url, data, callbackSuccess, callbackError, async) {
  85. ajax.post(url, data, function(method, data, readyState, status, responseText) {
  86. if(readyState == 4) {
  87. if(status == 200) {
  88. try {
  89. var r = JSON.parse(responseText);
  90. if(callbackSuccess) {
  91. callbackSuccess(method, data, readyState, status, r);
  92. };
  93. } catch(e) {
  94. if(callbackError) {
  95. callbackError(method, data, readyState, status, e);
  96. };
  97. };
  98. } else {
  99. if(callbackError) {
  100. var e = new AjaxErrorBadStatusCode('Bad status code '+status);
  101. callbackError(method, data, readyState, status, e);
  102. };
  103. };
  104. };
  105. }, async);
  106. };
  107. ajax.loadTag = function(tag, url, func, field) {
  108. if((typeof window[func] === 'function') || field != null) {
  109. if(!!!tag.className.match(new RegExp('(\\s|^)loading(\\s|$)'))) {
  110. tag.className += " loading";
  111. ajax.getJSON(url, {}, function(method, data, readyState, status, responseData) {
  112. try {
  113. if(typeof window[func] === 'function') {
  114. var html = window[func](tag, responseData);
  115. tag.innerHTML = html;
  116. } else if(field != null) {
  117. tag.innerHTML = responseData[field];
  118. };
  119. } catch(e) {
  120. console.log('ajax.loadTag', 'e', e);
  121. };
  122. tag.className = tag.className.replace(new RegExp('(\\s|^)loading(\\s|$)'), ' ').trim();
  123. }, function(method, data, readyState, status, responseData) {
  124. tag.className = tag.className.replace(new RegExp('(\\s|^)loading(\\s|$)'), ' ').trim();
  125. });
  126. };
  127. };
  128. };
  129. ajax.processTag = function(tag) {
  130. var get = tag.getAttribute('data-ajax-get');
  131. var func = tag.getAttribute('data-ajax-func');
  132. var field = tag.getAttribute('data-ajax-field');
  133. var delay = tag.getAttribute('data-ajax-delay');
  134. if((get && get != null) && ((func && func != null) || (field && field != null))) {
  135. if(delay == null) {
  136. ajax.loadTag(tag, get, func, field);
  137. } else {
  138. setTimeout(function() {
  139. ajax.loadTag(tag, get, func, field);
  140. }, delay);
  141. };
  142. };
  143. };
  144. ajax.processTags = function() {
  145. var tags = document.querySelectorAll('[data-ajax-get]');
  146. for(var key in tags) if(tags.hasOwnProperty(key)) {
  147. var tag = tags[key];
  148. ajax.processTag(tag);
  149. };
  150. };
  151. ajax.reloadTag = function(tag) {
  152. ajax.processTag(tag);
  153. };
  154. ajax.reloadTagById = function(id) {
  155. var tag = document.getElementById(id)
  156. if(tag != null) {
  157. ajax.reloadTag(tag);
  158. };
  159. };
  160. ajax.processFormSubmit = function(event) {
  161. if(!event) var event = window.event;
  162. event.preventDefault();
  163. var form = event.target;
  164. var func = form.getAttribute('data-ajax-func');
  165. if(func && func != null && typeof window[func] === 'function') {
  166. if(!!!form.className.match(new RegExp('(\\s|^)loading(\\s|$)'))) {
  167. form.className += " loading";
  168. var data = {};
  169. var inputs = form.querySelectorAll("input,select,textarea");
  170. for(var i=0,m=inputs.length-1; i<=m; i++) {
  171. data[inputs[i].name] = inputs[i].value;
  172. };
  173. var ajaxFunc = ajax.get;
  174. if(form.method == "post") { ajaxFunc = ajax.post; };
  175. ajaxFunc(form.action, data, function(method, data, readyState, status, responseText) {
  176. if(readyState == 4) {
  177. var error = (status == 200);
  178. var responseData = responseText;
  179. try {
  180. var responseData = JSON.parse(responseText);
  181. } catch(e) {
  182. console.log('ajax.processFormSubmit', 'e', e);
  183. };
  184. try {
  185. window[func](form, responseData, error, status);
  186. } catch(e) {
  187. console.log('ajax.processFormSubmit', 'e', e);
  188. };
  189. form.className = form.className.replace(new RegExp('(\\s|^)loading(\\s|$)'), ' ').trim();
  190. };
  191. });
  192. };
  193. };
  194. };
  195. ajax.processForm = function(form) {
  196. var is = form.getAttribute('data-ajax-form');
  197. var func = form.getAttribute('data-ajax-func');
  198. if((is && is != null && is == "true") && (func && func != null)) {
  199. if(window.attachEvent) {
  200. form.attachEvent('onsubmit', ajax.processFormSubmit);
  201. } else if(window.addEventListener) {
  202. form.addEventListener('submit', ajax.processFormSubmit, false);
  203. };
  204. };
  205. };
  206. ajax.processForms = function() {
  207. var forms = document.querySelectorAll('[data-ajax-form]');
  208. for(var key in forms) if(forms.hasOwnProperty(key)) {
  209. var form = forms[key];
  210. ajax.processForm(form);
  211. };
  212. };
  213. ajax.load = function() {
  214. if(!ajax.loaded) {
  215. ajax.loaded = true;
  216. ajax.processTags();
  217. ajax.processForms();
  218. };
  219. };
  220. if(window.attachEvent) {
  221. window.attachEvent('onload', ajax.load);
  222. } else if(window.addEventListener) {
  223. window.addEventListener('load', ajax.load, false);
  224. };