js/crm.ajax.js

   1 // https://civicrm.org/licensing
   2 /**
   3  * @see https://wiki.civicrm.org/confluence/display/CRMDOC/AJAX+Interface
   4  * @see https://wiki.civicrm.org/confluence/display/CRMDOC/Ajax+Pages+and+Forms
   5  */
   6 (function($, CRM, undefined) {
   7   /**
   8    * @param string path
   9    * @param string|object query
  10    * @param string mode - optionally specify "front" or "back"
  11    */
  12   var tplURL;
  13   CRM.url = function (path, query, mode) {
  14     if (typeof path === 'object') {
  15       tplURL = path;
  16       return path;
  17     }
  18     if (!tplURL) {
  19       CRM.console('error', 'Error: CRM.url called before initialization');
  20     }
  21     if (!mode) {
  22       mode = CRM.config && CRM.config.isFrontend ? 'front' : 'back';
  23     }
  24     query = query || '';
  25     var frag = path.split('?');
  26     var url = tplURL[mode].replace("*path*", frag[0]);
  27
  28     if (!query) {
  29       url = url.replace(/[?&]\*query\*/, '');
  30     }
  31     else {
  32       url = url.replace("*query*", typeof query === 'string' ? query : $.param(query));
  33     }
  34     if (frag[1]) {
  35       url += (url.indexOf('?') < 0 ? '?' : '&') + frag[1];
  36     }
  37     return url;
  38   };
  39
  40   // @deprecated
  41   $.extend ({'crmURL':
  42     function (p, params) {
  43       CRM.console('warn', 'Calling crmURL from jQuery is deprecated. Please use CRM.url() instead.');
  44       return CRM.url(p, params);
  45     }
  46   });
  47
  48   $.fn.crmURL = function () {
  49     return this.each(function() {
  50       if (this.href) {
  51         this.href = CRM.url(this.href);
  52       }
  53     });
  54   };
  55
  56   /**
  57    * AJAX api
  58    */
  59   CRM.api3 = function(entity, action, params, status) {
  60     if (typeof(entity) === 'string') {
  61       params = {
  62         entity: entity,
  63         action: action.toLowerCase(),
  64         json: JSON.stringify(params || {})
  65       };
  66     } else {
  67       params = {
  68         entity: 'api3',
  69         action: 'call',
  70         json: JSON.stringify(entity)
  71       };
  72       status = action;
  73     }
  74     var ajax = $.ajax({
  75       url: CRM.url('civicrm/ajax/rest'),
  76       dataType: 'json',
  77       data: params,
  78       type: params.action.indexOf('get') < 0 ? 'POST' : 'GET'
  79     });
  80     if (status) {
  81       // Default status messages
  82       if (status === true) {
  83         status = {success: params.action === 'delete' ? ts('Removed') : ts('Saved')};
  84         if (params.action.indexOf('get') === 0) {
  85           status.start = ts('Loading...');
  86           status.success = null;
  87         }
  88       }
  89       var messages = status === true ? {} : status;
  90       CRM.status(status, ajax);
  91     }
  92     return ajax;
  93   };
  94
  95   /**
  96    * @deprecated
  97    * AJAX api
  98    */
  99   CRM.api = function(entity, action, params, options) {
 100     // Default settings
 101     var settings = {
 102       context: null,
 103       success: function(result, settings) {
 104         return true;
 105       },
 106       error: function(result, settings) {
 107         $().crmError(result.error_message, ts('Error'));
 108         return false;
 109       },
 110       callBack: function(result, settings) {
 111         if (result.is_error == 1) {
 112           return settings.error.call(this, result, settings);
 113         }
 114         return settings.success.call(this, result, settings);
 115       },
 116       ajaxURL: 'civicrm/ajax/rest'
 117     };
 118     action = action.toLowerCase();
 119     // Default success handler
 120     switch (action) {
 121       case "update":
 122       case "create":
 123       case "setvalue":
 124       case "replace":
 125         settings.success = function() {
 126           CRM.status(ts('Saved'));
 127           return true;
 128         };
 129         break;
 130       case "delete":
 131         settings.success = function() {
 132           CRM.status(ts('Removed'));
 133           return true;
 134         };
 135     }
 136     params = {
 137       entity: entity,
 138       action: action,
 139       json: JSON.stringify(params)
 140     };
 141     // Pass copy of settings into closure to preserve its value during multiple requests
 142     (function(stg) {
 143       $.ajax({
 144         url: stg.ajaxURL.indexOf('http') === 0 ? stg.ajaxURL : CRM.url(stg.ajaxURL),
 145         dataType: 'json',
 146         data: params,
 147         type: action.indexOf('get') < 0 ? 'POST' : 'GET',
 148         success: function(result) {
 149           stg.callBack.call(stg.context, result, stg);
 150         }
 151       });
 152     })($.extend({}, settings, options));
 153   };
 154
 155   /**
 156    * Backwards compatible with jQuery fn
 157    * @deprecated
 158    */
 159   $.fn.crmAPI = function(entity, action, params, options) {
 160     CRM.console('warn', 'Calling crmAPI from jQuery is deprecated. Please use CRM.api3() instead.');
 161     return CRM.api.call(this, entity, action, params, options);
 162   };
 163
 164   $.widget('civi.crmSnippet', {
 165     options: {
 166       url: null,
 167       block: true,
 168       crmForm: null
 169     },
 170     _originalContent: null,
 171     _originalUrl: null,
 172     isOriginalUrl: function() {
 173       var
 174         args = {},
 175         same = true,
 176         newUrl = this._formatUrl(this.options.url),
 177         oldUrl = this._formatUrl(this._originalUrl);
 178       // Compare path
 179       if (newUrl.split('?')[0] !== oldUrl.split('?')[0]) {
 180         return false;
 181       }
 182       // Compare arguments
 183       $.each(newUrl.split('?')[1].split('&'), function(k, v) {
 184         var arg = v.split('=');
 185         args[arg[0]] = arg[1];
 186       });
 187       $.each(oldUrl.split('?')[1].split('&'), function(k, v) {
 188         var arg = v.split('=');
 189         if (args[arg[0]] !== undefined && arg[1] !== args[arg[0]]) {
 190           same = false;
 191         }
 192       });
 193       return same;
 194     },
 195     resetUrl: function() {
 196       this.options.url = this._originalUrl;
 197     },
 198     _create: function() {
 199       this.element.addClass('crm-ajax-container');
 200       if (!this.element.is('.crm-container *')) {
 201         this.element.addClass('crm-container');
 202       }
 203       this._handleOrderLinks();
 204       // Set default if not supplied
 205       this.options.url = this.options.url || document.location.href;
 206       this._originalUrl = this.options.url;
 207     },
 208     _onFailure: function(data, status) {
 209       var msg, title = ts('Network Error');
 210       if (this.options.block) this.element.unblock();
 211       this.element.trigger('crmAjaxFail', data);
 212       switch (status) {
 213         case 'Forbidden':
 214           title = ts('Access Denied');
 215           msg = ts('Ensure you are still logged in and have permission to access this feature.');
 216           break;
 217         default:
 218           msg = ts('Unable to reach the server. Please refresh this page in your browser and try again.');
 219       }
 220       CRM.alert(msg, title, 'error');
 221     },
 222     _onError: function(data) {
 223       this.element.attr('data-unsaved-changes', 'false').trigger('crmAjaxError', data);
 224       if (this.options.crmForm && this.options.crmForm.autoClose && this.element.data('uiDialog')) {
 225         this.element.dialog('close');
 226       }
 227     },
 228     _formatUrl: function(url, snippetType) {
 229       // Strip hash
 230       url = url.split('#')[0];
 231       // Add snippet argument to url
 232       if (snippetType) {
 233         if (url.search(/[&?]snippet=/) < 0) {
 234           url += (url.indexOf('?') < 0 ? '?' : '&') + 'snippet=' + snippetType;
 235         } else {
 236           url = url.replace(/snippet=[^&]*/, 'snippet=' + snippetType);
 237         }
 238       }
 239       return url;
 240     },
 241     // Hack to deal with civicrm legacy sort functionality
 242     _handleOrderLinks: function() {
 243       var that = this;
 244       $('a.crm-weight-arrow', that.element).click(function(e) {
 245         if (that.options.block) that.element.block();
 246         $.getJSON(that._formatUrl(this.href, 'json')).done(function() {
 247           that.refresh();
 248         });
 249         e.stopImmediatePropagation();
 250         return false;
 251       });
 252     },
 253     refresh: function() {
 254       var that = this;
 255       var url = this._formatUrl(this.options.url, 'json');
 256       if (this.options.crmForm) $('form', this.element).ajaxFormUnbind();
 257       if (this.options.block) this.element.block();
 258       $.getJSON(url, function(data) {
 259         if (that.options.block) that.element.unblock();
 260         if (!$.isPlainObject(data)) {
 261           that._onFailure(data);
 262           return;
 263         }
 264         if (data.status === 'error') {
 265           that._onError(data);
 266           return;
 267         }
 268         data.url = url;
 269         that.element.trigger('crmUnload').trigger('crmBeforeLoad', data);
 270         that._beforeRemovingContent();
 271         that.element.html(data.content);
 272         that._handleOrderLinks();
 273         that.element.trigger('crmLoad', data);
 274         if (that.options.crmForm) that.element.trigger('crmFormLoad', data);
 275       }).fail(function(data, msg, status) {
 276         that._onFailure(data, status);
 277       });
 278     },
 279     // Perform any cleanup needed before removing/replacing content
 280     _beforeRemovingContent: function() {
 281       var that = this;
 282       // Save original content to be restored if widget is destroyed
 283       if (this._originalContent === null) {
 284         $('.blockUI', this.element).remove();
 285         this._originalContent = this.element.contents().detach();
 286       }
 287       if (window.tinyMCE && tinyMCE.editors) {
 288         $.each(tinyMCE.editors, function(k) {
 289           if ($.contains(that.element[0], this.getElement())) {
 290             this.remove();
 291           }
 292         });
 293       }
 294       if (this.options.crmForm) $('form', this.element).ajaxFormUnbind();
 295     },
 296     _destroy: function() {
 297       this.element.removeClass('crm-ajax-container').trigger('crmUnload');
 298       this._beforeRemovingContent();
 299       if (this._originalContent !== null) {
 300         this.element.empty().append(this._originalContent);
 301       }
 302     }
 303   });
 304
 305   var dialogCount = 0,
 306     exclude = '[href^=#], [href^=javascript], [onclick], .no-popup, .cancel';
 307
 308   CRM.loadPage = function(url, options) {
 309     var settings = {
 310       target: '#crm-ajax-dialog-' + (dialogCount++),
 311       dialog: (options && options.target) ? false : {}
 312     };
 313     if (options) $.extend(true, settings, options);
 314     settings.url = url;
 315     // Create new dialog
 316     if (settings.dialog) {
 317       settings.dialog = CRM.utils.adjustDialogDefaults(settings.dialog);
 318       $('<div id="' + settings.target.substring(1) + '"></div>')
 319         .dialog(settings.dialog)
 320         .parent().find('.ui-dialog-titlebar')
 321         .append($('<a class="crm-dialog-titlebar-print ui-dialog-titlebar-close" title="'+ts('Print window')+'" target="_blank" style="right:3.8em;"/>')
 322           .button({icons: {primary: 'ui-icon-print'}, text: false}));
 323     }
 324     // Add handlers to new or existing dialog
 325     if ($(settings.target).data('uiDialog')) {
 326       $(settings.target)
 327         .on('dialogclose', function() {
 328           if (settings.dialog && $(this).attr('data-unsaved-changes') !== 'true') {
 329             $(this).crmSnippet('destroy').dialog('destroy').remove();
 330           }
 331         })
 332         .on('crmLoad', function(e, data) {
 333           // Set title
 334           if (e.target === $(settings.target)[0] && data && !settings.dialog.title && data.title) {
 335             $(this).dialog('option', 'title', data.title);
 336           }
 337           // Update print url
 338           $(this).parent().find('a.crm-dialog-titlebar-print').attr('href', $(this).data('civiCrmSnippet')._formatUrl($(this).crmSnippet('option', 'url'), '2'));
 339         });
 340     }
 341     $(settings.target).crmSnippet(settings).crmSnippet('refresh');
 342     return $(settings.target);
 343   };
 344   CRM.loadForm = function(url, options) {
 345     var formErrors = [], settings = {
 346       crmForm: {
 347         ajaxForm: {},
 348         autoClose: true,
 349         validate: true,
 350         refreshAction: ['next_new', 'submit_savenext', 'upload_new'],
 351         cancelButton: '.cancel',
 352         openInline: 'a.open-inline, a.button, a.action-item, a.open-inline-noreturn',
 353         onCancel: function(event) {}
 354       }
 355     };
 356     // Move options that belong to crmForm. Others will be passed through to crmSnippet
 357     if (options) $.each(options, function(key, value) {
 358       if (typeof(settings.crmForm[key]) !== 'undefined') {
 359         settings.crmForm[key] = value;
 360       }
 361       else {
 362         settings[key] = value;
 363       }
 364     });
 365
 366     var widget = CRM.loadPage(url, settings).off('.crmForm');
 367
 368     // CRM-14353 - Warn of unsaved changes for all forms except those which have opted out
 369     function cancelAction() {
 370       var dirty = CRM.utils.initialValueChanged($('form:not([data-warn-changes=false])', widget));
 371       widget.attr('data-unsaved-changes', dirty ? 'true' : 'false');
 372       if (dirty) {
 373         var id = widget.attr('id') + '-unsaved-alert',
 374           title = widget.dialog('option', 'title'),
 375           alert = CRM.alert('<p>' + ts('%1 has not been saved.', {1: title}) + '</p><p><a href="#" id="' + id + '">' + ts('Restore') + '</a></p>', ts('Unsaved Changes'), 'alert unsaved-dialog', {expires: 60000});
 376         $('#' + id).button({icons: {primary: 'ui-icon-arrowreturnthick-1-w'}}).click(function(e) {
 377           widget.attr('data-unsaved-changes', 'false').dialog('open');
 378           e.preventDefault();
 379         });
 380       }
 381     }
 382
 383     if (widget.data('uiDialog')) widget.on('dialogbeforeclose', function(e) {
 384       // CRM-14353 - Warn unsaved changes if user clicks close button or presses "esc"
 385       if (e.originalEvent) {
 386         cancelAction();
 387       }
 388     });
 389
 390     widget.on('crmFormLoad.crmForm', function(event, data) {
 391       var $el = $(this).attr('data-unsaved-changes', 'false'),
 392         settings = $el.crmSnippet('option', 'crmForm');
 393       if (settings.cancelButton) $(settings.cancelButton, this).click(function(e) {
 394         e.preventDefault();
 395         var returnVal = settings.onCancel.call($el, e);
 396         if (returnVal !== false) {
 397           $el.trigger('crmFormCancel', e);
 398           if ($el.data('uiDialog') && settings.autoClose) {
 399             cancelAction();
 400             $el.dialog('close');
 401           }
 402           else if (!settings.autoClose) {
 403             $el.crmSnippet('resetUrl').crmSnippet('refresh');
 404           }
 405         }
 406       });
 407       if (settings.validate) {
 408         $("form", this).crmValidate();
 409       }
 410       $("form:not('[data-no-ajax-submit=true]')", this).ajaxForm($.extend({
 411         url: data.url.replace(/reset=1[&]?/, ''),
 412         dataType: 'json',
 413         success: function(response) {
 414           if (response.content === undefined) {
 415             $el.trigger('crmFormSuccess', response);
 416             // Reset form for e.g. "save and new"
 417             if (response.userContext && (response.status === 'redirect' || (settings.refreshAction && $.inArray(response.buttonName, settings.refreshAction) >= 0))) {
 418               // Force reset of original url
 419               $el.data('civiCrmSnippet')._originalUrl = response.userContext;
 420               $el.crmSnippet('resetUrl').crmSnippet('refresh');
 421             }
 422             // Close if we are on the original url or the action was "delete" (in which case returning to view may be inappropriate)
 423             else if ($el.data('uiDialog') && (settings.autoClose || response.action === 8)) {
 424               $el.dialog('close');
 425             }
 426             else if (settings.autoClose === false) {
 427               $el.crmSnippet('resetUrl').crmSnippet('refresh');
 428             }
 429           }
 430           else {
 431             if ($el.crmSnippet('option', 'block')) $el.unblock();
 432             response.url = data.url;
 433             $el.html(response.content).trigger('crmLoad', response).trigger('crmFormLoad', response);
 434             if (response.status === 'form_error') {
 435               formErrors = [];
 436               $el.trigger('crmFormError', response);
 437               $.each(response.errors || [], function(formElement, msg) {
 438                 formErrors.push($('[name="'+formElement+'"]', $el).crmError(msg));
 439               });
 440             }
 441           }
 442         },
 443         beforeSubmit: function(submission) {
 444           $.each(formErrors, function() {
 445             if (this && this.close) this.close();
 446           });
 447           if ($el.crmSnippet('option', 'block')) $el.block();
 448           $el.trigger('crmFormSubmit', submission);
 449         }
 450       }, settings.ajaxForm));
 451       if (settings.openInline) {
 452         settings.autoClose = $el.crmSnippet('isOriginalUrl');
 453         $(this).on('click', settings.openInline, function(e) {
 454           if ($(this).is(exclude + ', .crm-popup')) {
 455             return;
 456           }
 457           if ($(this).hasClass('open-inline-noreturn')) {
 458             // Force reset of original url
 459             $el.data('civiCrmSnippet')._originalUrl = $(this).attr('href');
 460           }
 461           $el.crmSnippet('option', 'url', $(this).attr('href')).crmSnippet('refresh');
 462           e.preventDefault();
 463         });
 464       }
 465       if ($el.data('uiDialog')) {
 466         // Show form buttons as part of the dialog
 467         var buttonContainers = '.crm-submit-buttons, .action-link',
 468           buttons = [],
 469           added = [];
 470         $(buttonContainers, $el).find('input.crm-form-submit, a.button').each(function() {
 471           var $el = $(this),
 472             label = $el.is('input') ? $el.attr('value') : $el.text(),
 473             identifier = $el.attr('name') || $el.attr('href');
 474           if (!identifier || identifier === '#' || $.inArray(identifier, added) < 0) {
 475             var $icon = $el.find('.icon'),
 476               button = {'data-identifier': identifier, text: label, click: function() {
 477                 $el[0].click();
 478               }};
 479             if ($icon.length) {
 480               button.icons = {primary: $icon.attr('class')};
 481             } else {
 482               var action = $el.attr('crm-icon') || ($el.hasClass('cancel') ? 'close' : 'check');
 483               button.icons = {primary: 'ui-icon-' + action};
 484             }
 485             buttons.push(button);
 486             added.push(identifier);
 487           }
 488           // display:none causes the form to not submit when pressing "enter"
 489           $el.parents(buttonContainers).css({height: 0, padding: 0, margin: 0, overflow: 'hidden'}).find('.crm-button-icon').hide();
 490         });
 491         $el.dialog('option', 'buttons', buttons);
 492
 493         // Show done button for non-ajax dialogs (e.g. file downloads)
 494         $(this).on('submit', "form[data-no-ajax-submit=true]", function() {
 495           $el.dialog('option', 'buttons', [{
 496             text: ts('Done'),
 497             icons: {primary: 'ui-icon-close'},
 498             click: function() {$(this).dialog('close');}
 499           }]);
 500         });
 501       }
 502       // Allow a button to prevent ajax submit
 503       $('input[data-no-ajax-submit=true]').click(function() {
 504         $(this).closest('form').ajaxFormUnbind();
 505       });
 506       // For convenience, focus the first field
 507       $('input[type=text], textarea, select', this).filter(':visible').first().not('.dateplugin').focus();
 508     });
 509     return widget;
 510   };
 511   /**
 512    * Handler for jQuery click event e.g. $('a').click(CRM.popup);
 513    */
 514   CRM.popup = function(e) {
 515     var $el = $(this).first(),
 516       url = $el.attr('href'),
 517       popup = $el.data('popup-type') === 'page' ? CRM.loadPage : CRM.loadForm,
 518       settings = $el.data('popup-settings') || {},
 519       formSuccess = false;
 520     settings.dialog = settings.dialog || {};
 521     if (e.isDefaultPrevented() || !CRM.config.ajaxPopupsEnabled || !url || $el.is(exclude)) {
 522       return;
 523     }
 524     // Sized based on css class
 525     if ($el.hasClass('small-popup')) {
 526       settings.dialog.width = 400;
 527       settings.dialog.height = 300;
 528     }
 529     else if ($el.hasClass('medium-popup')) {
 530       settings.dialog.width = settings.dialog.height = '50%';
 531     }
 532     var dialog = popup(url, settings);
 533     // Trigger events from the dialog on the original link element
 534     $el.trigger('crmPopupOpen', [dialog]);
 535     // Listen for success events and buffer them so we only trigger once
 536     dialog.on('crmFormSuccess.crmPopup crmPopupFormSuccess.crmPopup', function() {
 537       formSuccess = true;
 538     });
 539     dialog.on('dialogclose.crmPopup', function(e, data) {
 540       if (formSuccess) {
 541         $el.trigger('crmPopupFormSuccess', [dialog, data]);
 542       }
 543       $el.trigger('crmPopupClose', [dialog, data]);
 544     });
 545     e.preventDefault();
 546   };
 547   /**
 548    * An event callback for CRM.popup or a standalone function to refresh the content around a given element
 549    * @param e {event|selector}
 550    */
 551   CRM.refreshParent = function(e) {
 552     // Use e.target if input smells like an event, otherwise assume it's a jQuery selector
 553     var $el = (e.stopPropagation && e.target) ? $(e.target) : $(e),
 554       $table = $el.closest('.dataTable');
 555     // Call native refresh method on ajax datatables
 556     if ($table.length && $.fn.DataTable.fnIsDataTable($table[0]) && $table.dataTable().fnSettings().sAjaxSource) {
 557       // Refresh ALL datatables - needed for contact relationship tab
 558       $.each($.fn.dataTable.fnTables(), function() {
 559         if ($(this).dataTable().fnSettings().sAjaxSource) $(this).unblock().dataTable().fnDraw();
 560       });
 561     }
 562     // Otherwise refresh the nearest crmSnippet
 563     else {
 564       $el.closest('.crm-ajax-container, #crm-main-content-wrapper').crmSnippet().crmSnippet('refresh');
 565     }
 566   };
 567
 568   $(function($) {
 569     $('body')
 570       .on('click', 'a.crm-popup', CRM.popup)
 571       // Close unsaved dialog messages
 572       .on('dialogopen', function(e) {
 573         $('.alert.unsaved-dialog .ui-notify-cross', '#crm-notification-container').click();
 574       })
 575       // Destroy old unsaved dialog
 576       .on('dialogcreate', function(e) {
 577         $('.ui-dialog-content.crm-ajax-container:hidden[data-unsaved-changes=true]').crmSnippet('destroy').dialog('destroy').remove();
 578       })
 579       // Ensure wysiwyg content is updated prior to ajax submit
 580       .on('form-pre-serialize', function(e) {
 581         $('.crm-wysiwyg-enabled', e.target).each(function() {
 582           CRM.wysiwyg.updateElement(this);
 583         });
 584       })
 585       // Auto-resize dialogs when loading content
 586       .on('crmLoad dialogopen', 'div.ui-dialog.ui-resizable.crm-container', function(e) {
 587         var
 588           $wrapper = $(this),
 589           $dialog = $wrapper.children('.ui-dialog-content');
 590         // small delay to allow contents to render
 591         window.setTimeout(function() {
 592           var currentHeight = $wrapper.outerHeight(),
 593             padding = currentHeight - $dialog.height(),
 594             newHeight = $dialog.prop('scrollHeight') + padding,
 595             menuHeight = $('#civicrm-menu').outerHeight(),
 596             maxHeight = $(window).height() - menuHeight;
 597           newHeight = newHeight > maxHeight ? maxHeight : newHeight;
 598           if (newHeight > (currentHeight + 15)) {
 599             $dialog.dialog('option', {
 600               position: {my: 'center', at: 'center center+' + (menuHeight / 2), of: window},
 601               height: newHeight
 602             });
 603           }
 604         }, 500);
 605       });
 606   });
 607
 608 }(jQuery, CRM));