web-dev-qa-db-fra.com

Comment puis-je charger le module JavaScript personnalisé sur le formulaire de modification du type de contenu?

J'essaie de charger jQuery sur le formulaire de modification administrateur d'un type de contenu.

Pour ce faire, j'ai développé un module "exclusivetabs" avec la structure de répertoires suivante:

|-- exclusivetabs
    |-- exclusive_tabs.info.yml
    |-- exclusive_tabs.libraries.yml
    |-- exclusive_tabs.module
    |-- js
        |-- cse_banner_header.js

Le contenu des fichiers concernés est le suivant:

exclusive_tabs.libraries.yml

exclusive_tabs:
  version: 1.x
  js:
    js/cse_banner_header.js: {}
  dependencies:
    - core/jquery
    - core/drupalSettings

exclusive_tabs.module

<?php

/**
 * Implements hook_form_alter().
 */
function exclusive_tabs_form_node_form_alter(&$form, &$form_state, $form_id) {
  /* @var Drupal\Core\Entity\FieldableEntityInterface $node */
  $node = $form_state->getFormObject()->getEntity();

  if ($node->getType() == 'unit_landing_page') {
   /* var_dump($node);*/
    $form['#attached']['library'][] = 'exclusive_tabs/cse_banner_header';
  }
}

cse_banner_header.js

(function($, Drupal) {

/* Add span to wysiwyg button classes for alignment
------------------------------------ */
Drupal.behaviors.calloutControl = {
        attach: function (context, settings) {
                console.log("I'm loaded!");
                $('#callout-link-options .single-link').click(function () {
                        $('input[type="checkbox"]').attr('checked', true);
                        console.log("I'm checked!");
                });
                $('#callout-link-options .multi-link').click(function () {
                        $('input[type="checkbox"]').attr('checked', false);
                        console.log("I'm unchecked!");
                });
        }
};

})(jQuery, Drupal);

Le module se charge sur le formulaire d'édition de type de contenu spécifique comme prévu; mon problème est que je n'ai pas compris comment charger jQuery à partir du fichier cse_banner_header.js. J'ai également vérifié les scripts en cours d'exécution dans le navigateur, et d'après ce que je peux dire, le fichier js ne se charge pas sur la page.

Qu'est-ce que je rate? Comment charger le fichier js sur la page?

8themingnodesjavascripthooks
3
lane

Vous devez changer cette ligne:

$form['#attached']['library'][] = 'exclusive_tabs/cse_banner_header';

à:

$form['#attached']['library'][] = 'exclusive_tabs/exclusive_tabs';

Comme le nom de votre bibliothèque est exclusive_tabs et non cse_banner_header la bonne façon est 'your_module/library_name' check Ajout de feuilles de style (CSS) et JavaScript (JS) à un Drupal 8 module .

5
Adrian Cid Almaguer