All geek questions in one place

JsTree not working

I'm new to jQuery and jsTree and I'm not sure why I can't get it to work? Using this tutorial: http://tkgospodinov.com/jstree-part-1-introduction/

And this html / javascript:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="description" content=""> <title> BLA BLA </title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- <link rel="stylesheet" href="css/styles.css"> --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> </script> <script type="text/javascript" src="jquery.jstree.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#selector").jstree(); }); </script> </head> <body> <div id="selector"> <ul> <li><a>Team A Projects</a> <ul> <li><a>Iteration 1</a> <ul> <li><a>Story A</a></li> <li><a>Story B</a></li> <li><a>Story C</a></li> </ul> </li> <li><a>Iteration 2</a> <ul> <li><a>Story D</a></li> </ul> </li> </ul> </li> </ul> </div> </body> </html>

Nothing seems to work. I get the following error:

 $("#selector").jstree is not a function
+3
source share
3 answers

Working demo of your example: JSFiddle1 and JSFiddle2

Please check the link and how you call it. This tree should be exactly the same as what you are looking for.

A late source of all documentation can be found here: http://www.jstree.com/

 <script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>

Include the files below. See the demo here .

 <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> <link rel="stylesheet" type="text/css" href="/css/normalize.css"> <link rel="stylesheet" type="text/css" href="/css/result-light.css"> <script type='text/javascript' src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>
+6
source

It looks like your browser just doesn't load jstree.js correctly?

You can try loading jstree.js from a CDN (content delivery network), just as jquery is loaded by changing the line:

 <script type="text/javascript" src="jquery.jstree.js"></script>

to

 <script type="text/javascript" src="http://cachedcommons.org/cache/jquery-jstree/1.0.0/javascripts/jquery-jstree-min.js"></script>
+2
source

It seems to me that your code cannot access the jstree() function. Maybe something is wrong on the way to jstree.js?

 <script type="text/javascript" src="jquery.jstree.js"></script>
0
source

Source: https://habr.com/ru/post/919670/

More articles:


All Articles