web-dev-qa-db-fra.com

Ajouter javascript au formulaire par module

j'écris un module en drupal 8. Je souhaite ajouter un javascript lors du chargement de ce formulaire.

function ajax_example_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id) {
 $form['#attached']['library'][] = array('ajax_example', 'ajax_example.sync_script');
}

et j'ai défini ce qui suit dans le fichier yml de la bibliothèque de modules

sync_script:
  version: 1.x
  js:
    js/test.js: {}

mais il semble que le js ne soit pas intégré. Et j'ai mis les js dans un dossier appelé js dans le répertoire racine du module.

Quel est le moyen pour drupal 8 d'incorporer un javascript dans le formulaire?

5
John Chan

Je ne sais pas ce que tu as l'intention de construire.

Parce que je pense qu'il n'est pas bon d'utiliser votre javascript dans hook_form_alter (), de cette façon, tout formulaire que vous essayez de voir invoquera ce code javascript.

Cependant ... Revenons à votre problème,

Je pense que la fonction hook_form_alter () doit être utilisée dans le fichier module_name.module sous la racine de votre dossier de modules: modules/custom/module_name/module_name. module le long du routage, des informations, etc.

Après avoir construit le fichier . Module, vous devez construire le fichier module_name.libraries.yml (s'il n'est pas déjà construit), et là, vous écrivez vos exigences de routage, exemple :

<route_name>:
  version: 1.x
  js:
    js/<your_javascript_file>.js: {}
  dependencies:
    - core/jquery
    - core/drupalSettings

Retour au fichier . Module, vous implémentez le hook_form_alter, donc votre code se présente comme ceci:

/**
 * Implements hook_form_alter().
 */

function <module_name>_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id){

    $form['#attached']['library'][] = '<module_name>/<route_name>';
    $form['#attached']['drupalSettings']['<module_name>']['<route_name>'] ['variable'] = 'value';

    return $form;

}

Pour vous en assurer, console.log votre PHP dans votre_fichier_javascript pour le voir, exemple:

(function($){
    console.log(drupalSettings.<module_name>.<route_name>.variable); // value
})(jQuery);

J'espère que cette aide!

22
jelhouss