I am trying to add inline jQuery to an article in Drupal. I am using the following code:

<?php 
// add inline javascript
drupal_add_js('
$(document).ready(function() {
   $("input[type='submit']").click(function(){
      alert("test");
    });
 });
 ', 'inline');
?>

The above code fails and produced 500 error on the page.
Can anyone give me insight on what the correct way to format the code above is.
I am pletely new at writing jQuery and Javascript for Drupal.

I am trying to add inline jQuery to an article in Drupal. I am using the following code:

<?php 
// add inline javascript
drupal_add_js('
$(document).ready(function() {
   $("input[type='submit']").click(function(){
      alert("test");
    });
 });
 ', 'inline');
?>

The above code fails and produced 500 error on the page.
Can anyone give me insight on what the correct way to format the code above is.
I am pletely new at writing jQuery and Javascript for Drupal.

• javascript
• jquery
• drupal
• drupal-7

3 Answers 3

You can add your inline javascript/jQuery code to your static content by the following way... When you are about to create static page (Content Management->Create Content->Page)

1. Choose the input format as PHP code
2. In the body of the page, paste the PHP code with your inline js/jQuery code by using drupal_add_js('Your JS code here', 'inline');

Example: (this will be pasted in the body of the page)

<?php echo 'test';
  drupal_add_js('alert("Hello!")', 'inline');
?>

drupal_add_js(), as explained in the Drupal API, can be used to add a javascript file to your code OR add inline javascript/jQuery. While you can create a js file, it would be only for your benefit - to keep your jQuery in one file instead of mixed in with your module's code (which can be messier).

To test that javascript is working, I would do something similar to what Ayyappan suggested:

drupal_add_js($(document).ready(function() {
  alert("Hello!");
});

This can be added to any page in your module and should pop up as soon as that page is opened. Possibly try clearing your cache if that doesn't work.

In terms of the code you actually want to run, it seems like you are trying to have an alert box appear when you click on a submit button (?). Submit buttons are usually part of a form, and in order to get jQuery to work in a drupal form you have to attach the jQuery directly to the form using:

$form['#attached']['js'] = 

You will have to do some research on exactly how to add inline javascript to a form. You may be able to just use the drupal_add_js(), or it might be something else. You can definitely attach a js file to the form this way using drupal_add_js(). It looks like this:

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

It's better to do this in a template_preprocess_page function. For a custom mymodule it may look like:

function mymodule_preprocess_page(&$vars, $hook) {
    if('checkout' === arg(0)) {
        // Add a JS as a file.
        drupal_add_js(path_to_theme().'/js/jquery.mask.min.js');
        // Add a JS as an inline code.
        drupal_add_js('jQuery(document).ready(function() { jQuery("#edit-customer-profile-shipping-field-phone-und-0-value").mask("0 (000) 000-0000", {placeholder: "\8 (___)___-____"});
  })', 'inline');

    }

    $vars['scripts'] = drupal_get_js();
}

Please pay attention to 'inline' option for drupal_add_js() function.