web-dev-qa-db-ja.com

添付ファイル付きのフォームにCSSとJSを追加する

外部およびローカルのCSSおよびJavaScriptファイルをフォームに追加する必要がありますが、これを行う正しい方法が見つからないようです。 JSファイルとCSSファイルのパスとURLを追加するだけですか?

私が想定し $form['#attached']['css'][]および$form['#attached']['js'][]はこれを行うのに適切な場所であるため、フォームの再構築時に再ロードされます。何かが足りないようです。

37
vintorg

ドキュメンテーションを見ましたか?

CSSとJSをフォームに添付します

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';

外部ファイル

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

外部の「js」および「css」ファイルもロードできます。例えば:

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

インラインCSSをフォームに追加する方法は次のとおりです...

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

addをcss配列置き換えるのではなくにする必要があることに注意してください。使用すべき意味:['css'][] = のではなく ['css'] =他の追加を押しつぶさないようにします。

11
doublejosh

これは、これを行う1つの方法です。 #after_buildプロパティを使用して関数を呼び出す。スイッチケースでフォームIDを渡すだけです。

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; 
}

また、この良いチュートリアルに従うこともできます CSSとJSをdrupal forms に追加する

お役に立てれば。 :)

6
Prerit Mohan