CODEWITHSUNDEEP
javascriptjqueryjstree
oneandonlycore
oneandonlycore

Reputation: 480

document.location strange behaviour? / alternative jsTree link solution?

I've build up an menu with jQuery.jsTree and every item should contain a link to a specific page. With jsTree it isnt possible to click these links due to the prevention of the standard behaviour of 

<a href="index.php?content=example" ... >....</a>

links (this is actually an example of one of my links. The index.php is my standard page and just the content will be replaced). In order to fix that I found this solution:

jQuery(".tree").bind("select_node.jstree", function (e, data) {
    document.location = data.rslt.obj.children("a").attr("href");
});

This solution works partly for me, which means the clicked link works but in the opened window Firebug tells me that jQuery is not defined. Is it possible that on document.location the browser "forget" the library imports (as I mentioned I stay on the index.php page and just replace the content)?

and the other question is: does anyone may know a better solution for the enabling of the links in jsTree without edit the library itself ?

thanks in advance!

Upvotes: 0

Views: 170

Answers (1)

Andrew Grothe
Andrew Grothe

Reputation: 2374

If your links at first look like:

<a href="index.php?content=example" ... >....</a>

And you want to load the content into a div with ID maincontent

You can do something like:

$(".tree a").each(function(){
  var $this = $(this);
  $this.click(function(){
     $("#maincontent").load($this.href, function(){
        // this callback functions fires once load is complete,
        // incase you need to do post-load operations
     });
     return false;
  });
});

This will byposs loading the new page as a normal link would, and fetch the page via AJAX and load the returned HTML into the DIV with ID maincontent.

Code is untested, but I've done this in the past so should work as is.

Upvotes: 1

Related Questions