Drupal 6 JavaScript and jQuery - Ebook-Cours.com

JavaScript Theming
}
var values = ['content','submitted','taxonomy','links'];
for (var i = 0; i < values.length; ++i) {
var value = values[i];
if (node[value]) {
tpl.find('.' + value).html(node[value]);
}
else {
tpl.find('.' + value).hide();
}
}
// Now we dump the template to a string.
out = tpl.parent().html();
}
return out;
The template has now been populated. However, like all theme functions, this must
return the results neither as a jQuery object, nor as HTML elements, but as a string.
To do this, we call tpl.parent().html(). This goes to the very root of the template
and retrieves the HTML as a string. At the end of this function, the string is returned.
Using the template system
We now have a basic template system. We can very quickly mock up a new function
to test out our template-based theme:
function addNode() {
var node = {
title: "New Node",
content: "JavaScript created this node!",
nodeUrl: 'http://drupal.org'
};
$('.node:last').after(Drupal.theme('node', node));
Drupal.attachBehaviors();
}
The addNode() function creates a new node object with a title, content, and a
nodeUrl. It then finds the node section and adds the new node to the end of the
existing list of nodes. For example, on the front page, it would add it at the bottom of
the page.
Notice that we call Drupal.theme('node', node) to invoke the Drupal.theme.
prototype.node() function that we just defined, and pass it our new node object.
Finally, since we have just altered the DOM, we need to run the Drupal.
attachBehaviors() function to make sure any new elements get evaluated by the
behaviors system.
[ 192 ]
This material is copyright and is licensed for the sole use by Richard Ostheimer on 18th June 2009
2205 hilda ave., , missoula, , 59801