This example module shows the usage of jquery_jstree..
If you are not in pressentation mode, press the slideshow icon to start.
cd /path/to/jquery_update wget -O - http://drupal.org/files/issues/jquery_update_775924_0.patch | patch -p0 cd /path/to/drupal_root wget -O - http://drupal.org/files/issues/479368_drupal_to_js_all_escaped_13.patch | patch -p0
jquery
inside the jquery_jstree
module folderwget -P /tmp http://jstree.googlecode.com/files/jsTree.v.1.0rc2.zip mkdir /path/to/jquery_jstree/jquery unzip /tmp/jsTree.v.1.0rc2-1.zip -d /path/to/jquery_jstree/jquery
Create a folder jstree_demo
cd /path/to/drupal_root/sites/all/modules mkdir jstree_demo cd jstree_demo
Create the .info
file
1: name = jsTree Demo 2: description = jsTree Demonstration plugin 3: dependencies[] = jquery_jstree 4: core = 6.x
1: function jstree_demo_perm() { 2: return array('access jstree_demo items'); 3: } // function jstree_demo_perm()
1: function jstree_demo_menu() { 2: $items = array(); 3: 4: // link to the jstree_demo, starts with jstree_demo_message_simple: 5: $items['jstree'] = array( 6: 'title' => 'jsTree', 7: 'description' => 'simple jsTree Demos with static js file or inline', 8: 'page callback' => 'jstree_demo_message_simple', 9: 'access arguments' => array('administer jstree_demo_module'), 10: 'type' => MENU_NORMAL_ITEM, 11: ); 12: 13: return $items; 14: }
1: function jstree_demo_message_simple () { 2: $page_content = ''; 3: // jstree needs a 'canvas', identified by id within the javascript part 4: $page_content = '<div id="demo" class="demo"></div>'; 5: drupal_add_js(drupal_get_path('module', 'jstree_demo') . '/jstree_demo.js'); 6: jq_add('jstree'); 7: return $page_content; 8: } // function jstree_demo_module_message ()
1: Drupal.behaviors.ews_gestconf_services = function (context) { 2: $(function () { 3: $("#demo").jstree({ 4: "json_data" : { 5: "data" : [ 6: { 7: "data" : "A node", 8: "children" : [ "Child 1", "Child 2" ] 9: }, 10: { 11: "attr" : { "id" : "li.node.id" }, 12: "data" : { 13: "title" : "Long format demo", 14: "attr" : { "href" : "#"+"foo" } 15: } 16: } 17: ] 18: }, 19: "themes" : {"theme" : "classic", 20: "url" : "sites/all/modules/contrib/jquery_jstree/jquery/themes/classic/style.css" 21: }, 22: "plugins" : [ "themes", "json_data" ] 23: }); 24: }); 25: }
{{vcard>[polyformal] Stefan Pampel <stefan-dot-pampel@polyformal.de-removeme> http://www.polyformal.de/ # +49 221 3103 122 & & & +49 221 9311 9223 | Kaesenstraße 8, D-50677 Köln, Germany }}{{vcards:stefan_pampel_small.jpg?80|}}