1

I have a page/node that contains 15 view blocks, each view block has many fields and all of this causes the page to load really slow.

How do I load the view block only when I need it? for example I would click a button/div (venue) then the view block venue will load instead of invoking all of the view blocks on the template and letting it load all at once.

UPDATE: I tried using ajax but it's not working even though I turned the ajax on the view block.

This the code I used:

JS:

$(document).ready(function(){
$("#getvenue").click(function(){
    $.ajax(
    Drupal.settings.basePath + 'views/ajax',
    {

    view_name: 'custom_package_form',view_display_id: 'block_56'
    },

    function(response)
    {
        if (response[1] !== undefined) 
        {
            var viewHtml = response[1].data;
            $("#output-venue").html(viewHtml);

            Drupal.attachBehaviors();
        }
        else {
            $("#output-venue").html("NONE");
        }


    });
    });
 });

Node Venue TPL:

<button id="getvenue"> GET VENUE </button>
<div id="output-venue"></div>

Nothing happens, I tried alerting the var viewHtml to see if it has something, the alert only shows null.

What's wrong with the JS? Can someone point me to the right direction?

Thank you in advance!

1

Try this code

$.ajax({
    url: Drupal.settings.basePath + 'views/ajax',
    type: 'POST',
    dataType: 'json',
    data: 'view_name=custom_package_form&view_display_id=block_56',
    success: function(response) {
      var output = response[1].data;
      $("#output-venue").html(output);
    },
    error: function(data) {
        alert('An error occured!');
    }
});
10
  • Hi, Thank you for your response. I tried this code, it's giving a null on the #output-venue div. It only appeared when I put "$("#output-venue").text(output);" to the js instead of html. I was wondering if the url is correct? I only based the coding to this link: blog.astaz3l.com/2013/06/24/drupal-views-ajax – Danz Aug 18 '15 at 7:19
  • The response from the server is important. use alert(output) to make sure it is correct. Then you can display it in any way you want. What url you are talking about? – M a m a D Aug 18 '15 at 7:28
  • The alert shows "null" also. As for the url, I was referring this part: url: Drupal.settings.basePath + 'views/ajax', I'm not sure if that is default? sorry for not being clear. – Danz Aug 18 '15 at 7:36
  • I used this code in a few websites and it works. Yes it is default – M a m a D Aug 18 '15 at 8:09
  • In View settings did you set the Use Ajax : Yes? – M a m a D Aug 18 '15 at 8:16
0

You need to try this module ajaxblock, I have used it with ubercart for building e-commerce site.

Permits to load some blocks by additional AJAX request after loading the whole cached page when the page is viewed by anonymous user. It is suitable for sites which are mostly static, and the page caching for anonymous users is a great benefit, but there are some pieces of information that have to be dynamic.

1
  • Hi, I'm trying out the module you recommended. I saw this: "Time in milliseconds to wait before block loading" on the settings of the blocks. I don't like the blocks to be loaded by some given time, I would like the blocks to be loaded individually when triggering an OnClick of a button. Is that possible? Because I would like the page to be as light as it can be, the 15 blocks should not be invoked/loaded on the page/tpl as long as the button that will call the block is not clicked. thanks again – Danz Aug 17 '15 at 7:22

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.