Drupal 7 jQuery function call issue

Question

I am experiencing the following issue within Drupal but it is probably not entirely a Drupal specific issue.

I have the following simple javascript:

(function ($) {

  function testing(){
    alert('TEST function responding!');
  }

})(jQuery);

And I am attempting to call that function from my Drupal module using the following code:

drupal_add_js('jQuery(document).ready(function () { testing(); });',
  array('type' => 'inline', 'scope' => 'footer', 'weight' => 5)
);

However, I get an error saying Uncaught ReferenceError: testing is not defined

I want to take advantage of jQuery's abilities within that function which is why I am not using an ordinary JavaScript file.

Chris · Accepted Answer · 2012-10-17 14:37:00Z

1

Quick and dirty answer: the scope in which you're defining testing() and in which you are calling it are not the same. You could define testing the global scope, and then it will work, although this is not best practice for a large application.

(function ($) {
    window.testing = function(){
        alert('TEST function responding!');
    }
})(jQuery);

answered Oct 17, 2012 at 14:37

Chris

7,3383 gold badges38 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ta Duy Anh · Accepted Answer · 2012-10-17 14:42:06Z

0

If you want to extend your function to jQuery variable, you can do this:

if( !jQuery.testing ){

jQuery.extend( {
    testing: function() { 
        console.log("Calling from extend function in jQuery");
    }
});
}

And to call it:

drupal_add_js('jQuery(document).ready(function () { jQuery.testing(); });',
  array('type' => 'inline', 'scope' => 'footer', 'weight' => 5)
);

answered Oct 17, 2012 at 14:42

Ta Duy Anh

1,4889 silver badges16 bronze badges

Comments

David Michael Harrison · Accepted Answer · 2012-10-17 15:01:21Z

0

Are you storing the first part of the code in an external JavaScript? use drupal_add_js to reference that e.g.,

drupal_add_js('js/external.js');

//external.js
jQuery.noConflict();
jQuery(document).ready(function($) {
window.testing = function(){
    alert('TEST function responding!');
// The useful part of this is the ability to use $ from now on. e.g., $('body').hide();
}
});
});

then add your JavaScript

drupal_add_js('jQuery(document).ready(function () { testing(); });',
array('type' => 'inline', 'scope' => 'footer', 'weight' => 5)
);

edited Oct 17, 2012 at 15:01

answered Oct 17, 2012 at 14:56

David Michael Harrison

3742 silver badges11 bronze badges

Collectives™ on Stack Overflow

Drupal 7 jQuery function call issue

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related