javascript - jstree plugin & stopPropagation issue -
i using jstree 3.0.8 first time , have issue stoppropagation. when click on span.nodeinfo, despite stoppropagation, stills trigger event of parent link.
you can see exemple on jsfiddle : http://jsfiddle.net/cloughylow/7p0xq698/29/
1. wanna :
- i need put a button on parts of tree trigger action. here use alert tests (at least dialog). (
<span class="nodeinfo">?</span>
in html below) - i want disable select (
deselect_node(data.node)
in js below) - and trigger open/colse on parents nodes (
toggle_node(data.node)
on js below)
the last 2 points of list ok. can't make first 1 work without trigger third 1 caus stoppropagation
doesn't seem work. have idea i'm doing wrong ?
2. i've done:
html
div id="mytreeview"> <ul> <li class="jstree-open" data-jstree='{"icon":"fa fa-folder"}'> title <span class="nodeinfo">?</span> <ul> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> </ul> </li> <li class="jstree-open" data-jstree='{"icon":"fa fa-folder"}'> title <span class="nodeinfo">?</span> <ul> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">my file</a></li> </ul> </li> </ul> </div>
js
$('#mytreeview').jstree({}); $('#mytreeview').on('select_node.jstree', function (e, data) { // avoid selection $('#mytreeview').jstree(true).deselect_node(data.node); // trigger open close if (data.node.children.length > 0) { $('#mytreeview').jstree(true).toggle_node(data.node); } //restore links else { var href = data.node.a_attr.href; window.open( href,'_blank' ); } }); // ------------------doesnt seem work --------------------- //stop propagation nodeinfo doesnt seem work $('body').on('click','.nodeinfo', function(event){ event.stoppropagation(); alert('test'); });
you can see exemple on jsfiddle : http://jsfiddle.net/cloughylow/7p0xq698/29/
hope explanation ok. help.
have tried:
event.preventdefault();
this works me:
$('.nodeinfo').on('click', function(event){ event.preventdefault(); event.stoppropagation(); alert('test'); });
Comments
Post a Comment