javascript - HTML form elements with a jstree? -
i have implemented jstree basic layout.
<div id="mytree"> <ul> <li class="category"><a href="#">category1</a> <ul><li class="subcategory"><a href="a">subcategory1</a></li></ul> <ul><li class="subcategory"><a href="a">subcategory2</a></li></ul> <ul><li class="subcategory"><a href="a">subcategory3</a></li></ul> </li> <li class="category"><a href="#">category2</a> <ul><li class="subcategory"><a href="a">subcategory1</a></li></ul> <ul><li class="subcategory"><a href="a">subcategory2</a></li></ul> <ul><li class="subcategory"><a href="a">subcategory3</a></li></ul> </li> </ul> </div>
jstree configuration here:
$('#mytree').jstree({ 'core' : { 'animation' : false }, 'themes' : { 'theme' : classic, 'dots' : false, 'icons' : true }, 'types' : { 'valid_children' : [ 'folder' ], 'types' : { 'folder' : { 'valid_children' : [ 'file'], 'max_depth' : 1 }, 'file' : { 'valid_children' : [ 'none' ], 'icon' : { 'image' : './images/file.png' }, } } }, 'plugins' : [ 'html_data', 'themes', 'types', 'contextmenu', 'search' ] });
this wrapped inside of jquery ui dialog:
var treedialog = $('#mytree').dialog({ autoopen: false , draggable: false, modal: false, resizable: false, show: 'slidedown', hide: 'slideup', position: 'top,left', });
everything works champ. can bring dialog , jstree populates nicely. have 150 subcategory class items , i'd have search box @ top of dialog can search them using jstree's search plugin. however, cannot figure out how accomplish this.
i tried making div above 'mytree' , using basis dialog while keeping 'mytree' jstree didnt work either.
is doable? i'd hard pressed think not. :)
Comments
Post a Comment