I'm using jqTree in a project in this way:
- dynamically add 'p' elements with '.root' class to the page.
- when a button is clicked, call jqTree for each of the 'p.root' elements.
- after each li is added, add an id using the onCreateLi event handler.
- after all trees are created, add a class to highlight the li's that occur more than once.
The last step is where I'm having trouble. Here's the code I'm using:
$('#compare-button').click(function(event){
event.preventDefault();
var last = false;
$('#output p.root').each(function(){
if ($(this).is(':last-child'))
{ last = true; } // set last = true on the last p.root
$(this).tree({
dataUrl: 'http://path/to/service/',
autoOpen: true,
dragAndDrop: false,
onCreateLi: function(node, $li){
$li.attr("value", node.id);
if (total_count.hasOwnProperty(node.id)) { total_count[node.id]++; }
else { total_count[node.id] = 1; }
if (last && $li.is(':last-child')) // Once we're done with our calls to .tree(), fire the highlighting code.
{
$.each(total_count, function(key, value){
if (value > 1) { $('li[value="' + key +'"] span').addClass('highlight'); }
});
}
} // end of onCreateLi
}) // end of tree()
}); // end of each()
}); // end of click()
The problem is that the 'onCreateLi' fires after each li, so the one it just created will always be the last sibling. I also tried a .load() on the end of the .each(), but it seemed to interrupt the building of the tree (I'm guessing it gets fired before the trees are built).
This would be much easier if there was a .afterLoad() event handler for jqTree.
EDIT: Wait, this might actually be working...
EDIT 2: Works in Firefox, not in IE.
EDIT 3: I'm going to ask this a different way, so more jQuery experts that aren't familiar with jqTree can answer it. I'm looping over each of the 'p.root' elemets using jQuery.each(). After that loop is done, I need to fire some code. I tried jQuery.each().after(), but it seems to interrupt the building of the tree.