Question

I’m using Drupal 6 and have created 2 equal columns in layout.css
In the left column I have a view with a list of nodes.
Each node has an attached view with a list of it’s child nodes (using views attach and a node reference argument).

I would like to be able to click a link on each of these left column nodes and bring up it’s child view in the right column using ajax.

I’ve tried placing jquery/javascript in the head of the node-xxx.tpl.php calling the viewsattach via an external page named ajaxview.php ie:

<script type="text/javascript">
Drupal.behaviors.ajaxview = function(context) {
$("#ajaxclick").click(function(){
        $("#container").load("http://path/to/ajaxview.php 
        });
}
</script>

<a id="ajaxclick" href= "#">Click me</a>
<div id="container"></div>

And in ajaxview.php :

<div id="rightcolumn"><?php print $node->content[Comments_node_content_1]['#value'];?></div>

I get nothing but a blank page…

How can I get a child view to appear in the right column whenever a node in the left column is clicked?

Is there a better way?

Answer 1

Your ajaxview.php file is not in the same context as your code in node-xxx.tpl.php and that means that it does not have access to $node variable. Your ajaxview.php file is executed as a new script, probably outside Drupal if you really named it ajaxview.php.

You should consider creating a path in your menu hook and call that path with ajax in your node-xxx.tpl.php.

<?php

function test_menu() {
  $items = array();

  $items['myajax'] = array(
    'title' => 'My Ajax',
    'page callback' => 'test_myajax',
    'description' => 'Test',
    'access arguments' => array('access content'),
    'type' => MENU_CALLBACK,
  );

  return $items;
}


function test_myajax($nid) {
  $node = node_load($nid);
  print '<div id="rightcolumn">';
  print $node->content['Comments_node_content_1']['#value'];
  print '</div>';
  exit();
}

This code will create a new path “myajax” (which you should rename to something more meaningfuyl to you) which should be called with a node id like this:

http://yoursite/myajax/999

where 999 is the node id.

This means that in your code that calls the ajax, you should pass the nid of the current node being viewed. There are different ways of doing this, depends on your context.

Here is a sample javascript that works with the code above (I tested it local).

<script type="text/javascript">
Drupal.behaviors.ajaxview = function(context) {
    $("#ajaxclick").click(function(){
        $("#container-test").load(Drupal.settings.basePath + "myajax/" + 999); 
    });
}
</script>

<a id="ajaxclick" href= "#">Click me</a>
<div id="container-test"></div>