Menu
I am new to jQuery and jsTree and I am not sure why I can't get it working? 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's 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
564
Working demo of your example: JSFiddle1 and JSFiddle2
Please check the reference and how you are calling it. This tree should be exactly the same as what you are looking for.
Rest the source of all the 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 mentioned below. See 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>
It looks like your browser just isn't loading jstree.js properly?
You can try loading jstree.js from CDN (content delivery network) just like jquery is being 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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
