1

I have create a module who add a new node named SquareOffs. I make that in my squareoffs.info file.
I would like to add to that node a javascript file, squareoffs.js, but I don't know to do that.

I have seen the drupal_add_js() documentation but I don't know understand how it works, how can I add the js file to this node??

Thank you very much for your answers or your sugestions!!

0

Yes. drupal_add_js() is used to add js in your theme or custom module.

I assume that the node has been fetched under this custom module.

If you want to add in your module. Use this

drupal_add_js(drupal_get_path('module', 'mymodule') . '/js/squareoffs.js');

The js file can be added as inline and external too.

For more details Click Here

Once the js file has been included, it will be applied to all the nodes under this custom module.

OR If you want to add a js for particular content type. You can add preprocessor function in my custom module:

function mymodule_preprocess_node(&$vars) {
    if($vars['type'] == 'Nodetype') {
        drupal_add_js('drupal_get_path('module', 'mymodule') . '/js/squareoffs.js');
    }
}
  • You should really use #attached rather than drupal_add_js() if you want the JS to be added every time the node's displayed (because this plays well with caching). – Andy Jul 30 '14 at 11:21
  • @Andy would you provide an example how to use #attached in template_preprocess_node? I've try to rewrite my preprocess function using #attached, and it won't load attached files after the node is cached, although it's working for the first page call. – Елин Й. Oct 20 '14 at 14:30
  • @ЕлинЙ. template_preprocess_node() is too late, because it's after you've already started rendering the render array. hook_node_view() or hook_node_view_alter() seem like sensible places to add any attached resources. – Andy Oct 20 '14 at 15:34
  • Thanks @Andy, I've also just figured out that and put them into hook_node_view(). It works great :) – Елин Й. Oct 20 '14 at 16:18
3

You can add your js through drupal_add_js() function. You can control on which pages this js should be added by implementing different hook and calling drupal_add_js() function in those hooks:

1) Use drupal_add_js() in hook_init() if you want to add this js on all drupal pages.

function mymoduel_init() {
  drupal_add_js(drupal_get_path('module', 'mymodule') . '/js/mymodule.js');
}

2) Use drupal_add_js() in hook_node_view() with content type condition check if you want to add this js on only specific content types.

function mymodule_node_view($node, $view_mode, $langcode) {
  if($node->type == 'my_content_type') {
    $node->content['#attached']['js'][] = array (
      'type' => 'file',
      'data' => drupal_get_path('module', 'mymodule') . '/js/mymodule.js',
    );
  }
}

3) Use drupal_add_js() in module's preprocess function if you want to add this js only on specific node

function mymodule_preprocess_page(&$variables) {
  if (isset($variables['node']) && $variables['node']->nid == 'your node nid') {
    // Add js
    drupal_add_js(drupal_get_path('module', 'mymodule') . '/mymodule.awesome.js');
  }
}

You can implement this preprocess_page at theme level like mytheme_preprocess_page($variable) in theme's template.php file.

  • hook_init() is no longer the way for global JS - you can use the info file instead. Also your third example I think should be done in the same way as your second. – Andy Jul 25 '14 at 8:57
  • @Andy you are right i just want to give the more possible ways. – MutantMahesh Jul 26 '14 at 12:41
  • Thank you very much for your help and your keen explanation! It work's perfectly, and I have better understand how drupal works! – Lauriane Mollier Jul 29 '14 at 17:30
0

If you are working on developing a website, I suggest you to use JS injector Module and you can insert you jQuery/JavaScript into your website theme. To insert a jQuery, navigate to Configuration -> development -> Js Injector -> Add.

You can add your JScode as :

(function ($) { // your jquery goes here... })(jQuery); 

If you are working on developing a module, go through this link and add your javaScript.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.