0

This may be as much a style question as anything, but: I'm building a site that uses the Bootstrap theme and a bunch of Bootstrap features -- popovers, dialogs, and the like. This means that I often need to run little bits of initialization code when the page loads; I'm doing these by using drupal_add_js to add the needed bits of jQuery, wrapped in a document.ready() handler. The usual sort of thing, I think.

This works fine, but they are all being added to the page in their own SCRIPT and document.ready blocks. Thus the page looks like:

<script>(function ($) {
        $(document).ready(function() {
            somejQueryCode();
        });
    })(jQuery);
</script>
<script>(function ($) {
        $(document).ready(function() {
            someMorejQueryCode();
        });
    })(jQuery);
</script>
<script>(function ($) {
        $(document).ready(function() {
            stillSomeMorejQueryCode();
        });
    })(jQuery);
</script>

as to what it seems like it might be:

<script>(function ($) {
        $(document).ready(function() {
            somejQueryCode();
            someMorejQueryCode();
            stillSomeMorejQueryCode();
        });
    })(jQuery);
</script>

You get the idea. Like I said, the individual blocks are working, but it seems a little wrong -- you'd surely never write the code by hand like that. I've explored various arguments to drupal_add_js, and have started experimenting with the AdvAgg module, but haven't found anything that works. Is there a better way to do this? Comments to the effect of "this isn't a big deal, don't worry about it" will also be accepted... Thanks!

  • Have you tried with drupal behaviors? – sanzante Oct 6 '16 at 18:46
  • No -- could you elaborate? – Jim Miller Oct 6 '16 at 20:29
  • Are you using a custom subtheme? – David Thomas Oct 7 '16 at 0:27
  • Yes (I'm using a custom subtheme). – Jim Miller Oct 7 '16 at 15:46
1

In Drupal, $(document).ready() is not used. The Drupal API uses Drupal.behaviors.

You didn't mention your version of Drupal. But you can read about the Drupal 7 JavaScript API here: https://www.drupal.org/node/756722

Here is Drupal 8: https://www.drupal.org/node/2269515

And here is a pretty comprehensive breakdown/tutorial I wrote on using the D7 API: http://www.jaypan.com/tutorial/high-performance-javascript-using-drupal-7s-javascript-api

  • Hmm. I'll look at that -- thanks! (I'm on Drupal 7, btw). – Jim Miller Oct 7 '16 at 15:47
  • BTW: This was very helpful; I'm getting the hang of it. A followup question: If I attach some jQuery via $element['#attached']['js'][]..., is it NOT necessary to wrap that jQuery in a $(document).ready (assuming that the page needs to be fully-formed before the jQuery runs)? – Jim Miller Nov 2 '16 at 15:31
  • Sorry about my late response. $(document).ready() is never used in Drupal. It's always Drupal.behaviors, which is the Drupal version of the jquery function you are looking for. – Jaypan Nov 7 '16 at 3:12

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.