39 lines
934 B
PHTML
39 lines
934 B
PHTML
|
<style>
|
||
|
|
.jstree-default a.jstree-search { color: red; }
|
||
|
|
</style>
|
||
|
|
<div>
|
||
|
|
<input id="text" type="text" value="">
|
||
|
|
<input id="search" type="button" value="Recherche">
|
||
|
|
<input id="clear_search" type="button" value="Initialiser">
|
||
|
|
</div>
|
||
|
|
<div id="groups" class="jstree jstree-default" style="overflow:auto;"></div>
|
||
|
|
<script src="/libs/jstree/jquery.jstree.min.js"></script>
|
||
|
|
<script>
|
||
|
|
$("#groups").jstree({
|
||
|
|
"core" : {
|
||
|
|
"html_titles" : true,
|
||
|
|
},
|
||
|
|
"plugins" : ["themes", "json_data", "search"],
|
||
|
|
"json_data" : {
|
||
|
|
"data" : [<?=$this->data?>],
|
||
|
|
},
|
||
|
|
"search" : {
|
||
|
|
"show_only_matches" : true,
|
||
|
|
},
|
||
|
|
"themes" : {
|
||
|
|
"theme" : "default",
|
||
|
|
"url" : "/libs/jstree/themes/default/style.css",
|
||
|
|
"dots" : true,
|
||
|
|
"icons" : false,
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$('#clear_search').on('click', function() {
|
||
|
|
$("#text").val('');
|
||
|
|
$("#groups").jstree("clear_search");
|
||
|
|
});
|
||
|
|
|
||
|
|
$('#search').on('click', function(){
|
||
|
|
$("#groups").jstree("search", $("#text").val());
|
||
|
|
});
|
||
|
|
</script>
|