diff --git a/core/misc/ajax.js b/core/misc/ajax.js index fefe9f3..00f5c7e 100644 --- a/core/misc/ajax.js +++ b/core/misc/ajax.js @@ -50,25 +50,7 @@ } } - // Bind Ajax behaviors to all items showing the class. - $('.use-ajax').once('ajax').each(function () { - var element_settings = {}; - // Clicked links look better with the throbber than the progress bar. - element_settings.progress = {type: 'throbber'}; - - // For anchor tags, these will go to the target of the anchor rather - // than the usual location. - var href = $(this).attr('href'); - if (href) { - element_settings.url = href; - element_settings.event = 'click'; - } - element_settings.dialogType = $(this).data('dialog-type'); - element_settings.dialog = $(this).data('dialog-options'); - element_settings.base = $(this).attr('id'); - element_settings.element = this; - Drupal.ajax(element_settings); - }); + Drupal.ajax.bindAjaxLinks($(window)); // This class means to submit the form to the action using Ajax. $('.use-ajax-submit').once('ajax').each(function () { @@ -277,6 +259,34 @@ }; /** + * Bind Ajax functionality to links that use the 'use-ajax' class. + * + * @param $element + * Element to enable Ajax functionality for. + */ + Drupal.ajax.bindAjaxLinks = function ($element) { + // Bind Ajax behaviors to all items showing the class. + $element.find('.use-ajax').once('ajax').each(function () { + var element_settings = {}; + // Clicked links look better with the throbber than the progress bar. + element_settings.progress = {type: 'throbber'}; + + // For anchor tags, these will go to the target of the anchor rather + // than the usual location. + var href = $(this).attr('href'); + if (href) { + element_settings.url = href; + element_settings.event = 'click'; + } + element_settings.dialogType = $(this).data('dialog-type'); + element_settings.dialog = $(this).data('dialog-options'); + element_settings.base = $(this).attr('id'); + element_settings.element = this; + Drupal.ajax(element_settings); + }); + }; + + /** * Settings for an Ajax object. * * @typedef {object} Drupal.Ajax~element_settings diff --git a/core/modules/contextual/js/contextual.js b/core/modules/contextual/js/contextual.js index 7f93a15..0f08b31 100644 --- a/core/modules/contextual/js/contextual.js +++ b/core/modules/contextual/js/contextual.js @@ -81,6 +81,9 @@ // trigger the model change event handler in its views. contextual.collection.add(model); + // Enable Ajax functionality for contextual links. + Drupal.ajax.bindAjaxLinks($region); + // Let other JavaScript react to the adding of a new contextual link. $(document).trigger('drupalContextualLinkAdded', { $el: $contextual, diff --git a/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.info.yml b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.info.yml new file mode 100644 index 0000000..b2ad373 --- /dev/null +++ b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.info.yml @@ -0,0 +1,10 @@ +name: 'Contextual Ajax tests' +type: module +description: 'Provides contextual Ajax tests.' +package: Testing +version: VERSION +core: 8.x +dependencies: + - contextual + - block + - router_test diff --git a/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.links.contextual.yml b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.links.contextual.yml new file mode 100644 index 0000000..c58afcb --- /dev/null +++ b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.links.contextual.yml @@ -0,0 +1,4 @@ +contextual_ajax_test: + title: 'Contextual Ajax Test' + route_name: 'router_test.2' + group: 'block' diff --git a/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.module b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.module new file mode 100644 index 0000000..5c9afcb --- /dev/null +++ b/core/modules/contextual/tests/modules/contextual_ajax_test/contextual_ajax_test.module @@ -0,0 +1,21 @@ + ['use-ajax'], + 'data-dialog-type' => 'modal', + ]; + } +}