10

I was doing lot of posts on drupal.org about this topic, but unfortunately in the wrong context.

I think that is not the problem, so i try it with a different approach, and maybe this could be the solution. Loading the whole PHP Page and extract a certain div with ajax didn't works the right way. So i thought, that i could let drupal load just the content and inject it with ajax into the div. I made a query with the hook_preprocess_page and hook_preprocess_node that is looking for a "ajax=1" in the requested URL and then only gives out the content without the whole page. And now with help of certain tpl.php files, in theory, i could limit the output of drupal to only $content. And here is the problem. My approach is working even when i leave the tpl.php files the original way, but removing the "$content" from node-ajax.tpl.php. With "working the right way", i mean that drupal doesn't reload the whole page, but off course not the content. But i can not explain that to myself, cause in the $content variable, so i thought, is only the html of the generated content. So my question is, how can i limit the output of drupal, to just the content, or am i doing the wrong steps to get this working. Here is the module and js file i'm using: my_ajax.module:

<?php

function my_ajax_init()
{
    drupal_add_js(drupal_get_path('module', 'my_ajax') . '/my_ajax.js');
}

function my_ajax_preprocess_page(&$vars, $hook)
{

    if (isset($_GET['ajax']) && $_GET['ajax'] == 1)
    {
        $vars['template_file'] = 'page-ajax';
    }
}

function my_ajax_preprocess_node(&$vars, $hook)
{

    if (isset($_GET['ajax']) && $_GET['ajax'] == 1)
    {
        $vars['template_file'] = 'node-ajax';
    }
}

my_ajax.js:

Drupal.behaviors.my_ajax = function (context) {
    $('#content-group-inner .node a').live('click', function (e) {
        var url = $(this).attr('href');
        //$('#content-region-inner').slideUp('slow');
        $('#content-region-inner').empty().html('<img src="ajax-loader.gif" style="margin-left:50%;"/>');
        xhr = $.ajax({
            data: 'ajax=1',
            type: 'GET',
            url: url,
            success: function (data) {
                $('#content-region-inner').html(data);
                Drupal.attachBehaviors(context);
            }
        });
        return false;
    });
};

Please help me with this. Every suggestion is appreciated.

  • 2
    Just a small comment D7 uses /nojs and /ajax in the path to distinguish between ajax links and standard ones. That may save you some headache later on. – Jeremy French May 6 '11 at 9:00
11

I've got it. This is working the right way:

Drupal.behaviors.my_ajax = function (context) {
    $('#content-group-inner a').live('click', function (e) {

        $('#content-group-inner a').addClass('my_ajax-processed');
        var url = $(this).attr('href');
        $('#content-region-inner').empty().html('<img src="ajax-loader.gif" style="margin-left:50%;"/>');        
        $('#content-region-inner').load(url,'ajax=1',function() {
                        Drupal.attachBehaviors('#content-region-inner');
                        });
        return false;
        });
   };

Thank you for all your help.

  • 1
    Remember to mark your own answer as the accepted one (and upvote all answers that helped). This marks this question as resolved in the overview. Upvoting additionally helps to encourage users to provide good answers. – Berdir May 8 '11 at 16:12
  • You should also use the "context" in your attaching. – Josh Koenig Oct 18 '11 at 0:06
  • just noting .live() is now deprecated – ErichBSchulz Nov 4 '13 at 6:43
  • Not using context (as Josh Koenig pointed out) is a big no-no. Your event handler will be re-attached to all elements on the page. With using context, this code would need to be changed, as the context contains document on the first event binding and the element itself when the content will be replaced, so simple $('#content-group-inner a',context) is not going to work. – Alex.Designworks Feb 23 '17 at 0:01
10

I think your issues is that your success function won't have the variable context in scope so attach behaviors will be working on undefined.

I would guess that you could do

Drupal.attachBehaviors($('#content-region-inner'));
  • I thought that the success function would be a closure and keep the variable context (which is the old context rather than the new markup) in scope: is that wrong? – Andy May 6 '11 at 9:14
  • I don't think it works as a closure in this case, but I could be very wrong about it. – Jeremy French May 6 '11 at 10:33

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.