How to load a view with ajax so that additional js/css files needed by the view are also loaded?

Question

Currently I'm using jQuery to load a view, like this:

$.ajax({
    type: 'POST',
    url: Drupal.settings.basePath + 'views/ajax',
    dataType: 'json',
    data: 'view_name=' + viewName + '&view_display_id=default&view_args=' + viewArgument, // Pass a key/value pair.
    success: function(data) {
      var viewHtml = data[1].data;
      target.children().fadeOut(300, function() {
        target.html(viewHtml);

        var newHeightOfTarget = target.children().height();

        target.children().hide();

        target.animate({
          height: newHeightOfTarget
        }, 150);

        target.children().delay(150).fadeIn(300);

        Drupal.attachBehaviors(target);
      });
    },
    error: function(data) {
      target.html('An error occured!');
    }
  });

My problem is, that for example if the view uses the 'Field Slideshow' module, the js/css files needed for it to work properly are not loaded. What could be a nice (= kittens unharmed) solution to this?

Answer 1

Hmm, I feel like this question deserves a bigger bounty :-p but none the less here's my attempt at answering this.

Drupal already loads any extra css/js now I can't really find much documentation on it and sadly the JS files aren't easily documented without actually reading through the code but is there.

You really should try to avoid making $.ajax request yourself and instead wrapping everything with Drupal.ajax also if you use the Ajax System you don't even need to write the ajax request your self.

By implementing a proper Drupal ajax request using ajax commands most of the css/js handling will be done for you automatically.

By looking at your above code it looks like you you're making the same request views would normally do it self. So you should probably let views handled the ajax request and overwrite the ajax commands thats going to be fired to be your command. You can do this by either implementing a hook_ajax_comamnd_alter but it kinda sucks with views because you loose all contextual information so I would recommend using hook_views_ajax_data_alter instead.

I know there's not much code in my answer, but it's hard to answer with code, being that the code currently there is not correct to being with.

For more information see Drupal.ajax in the misc/ajax.js file. For an example of implementing an ajax request with Drupal.ajax see the views ajax file. And if you want to see and example of views normal behavior being overwritten by changing the ajax commands see the views_load_more module where I do this behavior.

Also please feel free to comment on this answer, if anything here is unclear.

On and for more info on the Ajax Framework see Ajax Framework for example see the example module, even thought most of what you want to do is not cover in the examples module.