web-dev-qa-db-ja.com

JSとCSSをnode / editや他のフォームに追加する正しい方法

私はたくさんのJSを含むサイトを作成していて、JSコードをどこに配置すればよいか疑問に思っています。最適には、テーマレイヤーではなく各モジュールでJSを保持したいと思います。一部のコンテンツはブロックなどとして公開される可能性があります。

しかし、キャッシュに関していくつか問題があります。私の例では、JSとCSSをノード編集フォームに追加する必要があります。 hook_block_viewを使用しましたが、キャッシュされています。したがって、ノード編集フォームにエラーがある場合、drupal_add_jsおよびdrupal_add_css関数は呼び出されません。同じことがhook_node_prepareにも当てはまるようです。

JS&CSSレイヤーはどこに入力しますか?そして、ノード編集フォームにエラーがある場合でも呼び出されるフックはありますか?

10
Jens

JSとCSSをノード編集ページ(または一般に任意のフォーム)に追加する場合、最適な場所はhook_form_alter()で、使用するプロパティは#after_buildです。

DOに関するこのコメントは、何をすべきかを正確に示しています- http://drupal.org/node/1253520#comment-4881588

お役に立てれば :-)

6
Sumeet Pareek

#attached プロパティを使用して、JS/CSSが常に別のレンダリング要素とともに適切に読み込まれるようにする必要があります。

6
Letharion

これらの回答とコメントには、特に@AyeshKと@Letharionのサンプルコードが必死に必要だと感じました。コメントとしては長すぎますので、ご容赦ください。役に立ったら、スミートかレサリオンのどちらかの回答に賛成投票してください。また、次の例では明らかにCSSを追加していますが、JavaScriptを追加する場合もほぼ同じです。

@Sumeetの回答を使用しますが、 #attached の代わりに drupal_add_css プロパティを使用すると、次のようになります。

/* Implements hook_form_FORM_ID_alter() */
function MY_MODULE_form_MY_FORM_ID_alter(&$form, &$form_state, $form_id) {
  $form['#after_build'][] = 'MY_MODULE_some_function_name_after_build';
}

function MY_MODULE_some_function_name_after_build($form, &$form_state) {
  $style_path = drupal_get_path('module','MY_MODULE') . '/css/my_css.css';
  // drupal_add_css('file', $style_path);
  $form['#attached']['css'][] = $style_path;
  return $form;
}

最後に、drupal_add_cssの廃止予定は this post にあります。それは、私にとってdrupal_add_xxxがうまく機能していた多くの人にとって、ニュースかもしれません。

3

Drupal 8の場合、これを確認することをお勧めします 記事

libraries.yml

something: 
  version: VERSION
  js: 
    js/something.js: {}
  dependencies: 
    - core/jquery

。module

function MODULE_page_attachments(array &$page) {
  $page['#attached']['library'][] = MODULE/something;
}
0
Chris Happy