Aggiunta di CSS e JS al modulo con allegati


36

Devo aggiungere alcuni file CSS e JavaScript esterni e locali a un modulo, ma non riesco a trovare il modo giusto per farlo. Devo semplicemente aggiungere i percorsi e gli URL per i file JS e CSS?

Presumo $form['#attached']['css'][]e $form['#attached']['js'][]sono i posti corretti per farlo, quindi vengono ricaricati durante le ricostruzioni dei moduli. Mi sembra che manchi qualcosa.

Risposte:


71

Hai guardato la documentazione?

Collega CSS e JS al modulo

http://api.drupal.org/api/drupal/developer!topics!forms_api_reference.html/7#attached

$form['#attached']['css'][] = drupal_get_path('module', 'ajax_example') . '/ajax_example.css';

$form['#attached']['js'][] = drupal_get_path('module', 'ajax_example') . '/ajax_example.js';

File esterni

http://api.drupal.org/api/drupal/includes%21common.inc/function/drupal_process_attached/7

È anche possibile caricare file "js" e "css" esterni. Per esempio:

$build['#attached']['js']['http://code.jquery.com/jquery-1.4.2.min.js'] = array('type' => 'external');

Io ho. Puoi dirmi dove fa riferimento a come gestire i file CSS esterni?
vintorg,


2
Solo una nota: puoi aggiungere JavaScript come descritto sopra al modulo specifico aggiungendo la funzione denominata <module name>_form_<form id>_alteral tuo modulo. L' identificazione del
Nux

1
Questo esempio è un po 'brutto perché stai supponendo che questo sarà l'UNICO allegato nel modulo!
doublejosh

6
Il commento di doublejosh significa: di solito si dovrebbe aggiungere all'array piuttosto che sostituirlo. Quindi l'esempio dovrebbe essere $form['#attached']['css'][] = drupal_get_path('module', 'ajax_example') . '/ajax_example.css';ecc.
tanius,

11

Ecco il metodo per aggiungere CSS inline ai moduli ...

$form['#attached']['css'][] = array(
  'data' => '.my-example-element { display: none; }',
  'type' => 'inline',
);

Si noti che è necessario aggiungere l'array css anziché sostituirlo . Significa che dovresti usare: ['css'][] =piuttosto che ['css'] =evitare di schiacciare altre aggiunte.


6

Ecco un modo per farlo che è via. chiamando una funzione usando la #after_buildproprietà Basta inserire il tuo ID modulo in caso di commutazione.

function mymodule_form_alter(&$form, &$form_state, $form_id) {
  switch ($form_id) {
    case 'my_form':
      $form['#after_build'][] = 'mymodule_after_build';
      break;
  }
}

function mymodule_after_build($form, &$form_state) {
  $path = drupal_get_path('module', 'mymodule');
  drupal_add_js ("$path/mymodule.js");
  return $form; 
}

Inoltre puoi seguire questo buon tutorial Aggiungere css e js ai moduli drupal

Spero che sia di aiuto. :)


Mentre questo funziona ancora in Drupal 7, sembra essere un hack D6 , necessario perché #attachednon esisteva in D6 .
tanius,

Non è necessario utilizzare drupal_add_jssu un modulo. Si finirà con problemi di stato di convalida.
doublejosh,

1
@doublejosh Questa è una risposta di tre anni :)
Prerita Mohan il
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.