Drupal Javascript

22/02/2025, by Anonymous (not verified)

Forums

To add jQuery once as an explicit dependency of a custom library, add core/jquery.once as shown below in MODULE.libraries.yml or THEME.libraries.yml:

foobar:
  js:
    js/foobar.js: {}
  dependencies:
    - core/jquery
    - core/jquery.once

A really basic example:

Drupal.behaviors.myBehavior = {
  attach: function (context, settings) {
    // Using once() to apply the myCustomBehaviour effect when you want to run just one function.
    $('input.myCustomBehavior', context).once('myCustomBehavior').addClass('processed');

    // Using once() with more complexity.
    $('input.myCustom', context).once('mySecondBehavior').each(function () {
      if ($(this).visible()) {
        $(this).css('background', 'green');
      }
      else {
        $(this).css('background', 'yellow').show();
      }
    });
  }
};

Drupal API documentation:

https://www.drupal.org/docs/8/api/javascript-api/javascript-api-overview

Palette - Make it Colorful🎨

Let’s talk