2011-02-02 2 views
7

ui 플러그인을 사용하면 트리 노드에 대한 링크가 끊어집니다. 이것은 새로운 것은 아니며 다른 곳에서이 문제에 대한 언급을 발견했습니다. 첫 번째 원인은 v1.6 jquery 유효성 검사 플러그인에 문제가있었습니다. 그 플러그인을 사용하지 않아서 그 원인이 될 수 없습니다.ui 플러그인을 사용할 때 Jstree 노드가 작동하지 않습니다.

또한 <a> 태그에 jstree 클릭 클래스를 추가하는 몇 가지 방법을 설명하는 좋은 게시글을 발견했습니다. 저것은 유망하게 보였습니다, 그러나 제가 그것을 시도했을 때 저는 어떤 차이도 느끼지 않았습니다. 예상대로

나는 UI 플러그인을 가지고가는 경우에
<div id="treediv"> 
    <ul> 
     <li id="page1"><a href="http://www.yahoo.com" class="jstree-clicked">YAHOO!</a></li>   
    </ul> 
</div> 
<script type="text/javascript" class="source"> 
$(function() { 

$("#treediv") 
    .jstree({ 
     "core" : { 
      "animation" : 0 
     }, 
     "themes" : { 
      "theme" : "classic" 
     }, 
     "plugins" : [ "themes", "html_data", "cookies", "ui" ] 
    }); 
}); 
</script> 

, 다음 링크를 클릭하면 yahoo.com에 저를 취 여기 아주 간단한 예이다. 누구든지 아이디어가 있습니까?

답변

10

나는 found the answer on the jstree discussion group으로 생각합니다. ui 플러그인을 사용하면 노드를 "선택"할 수 있지만 클릭은 앵커 태그로 전달되지 않습니다. 그래서 노드가 선택 될 때마다 실행될 함수를 바인드해야합니다. 나는 다음과 같은 .bind 이것을 달성 : 측면 혜택으로

.bind("select_node.jstree", function (e, data) { 
    var href = data.rslt.obj.children("a").attr("href"); 
    // this will load content into a div: 
    $("#contents").load(href); 
    // this will follow the link: 
    document.location.href = href; 
    }) 

,이 예는 저를 보였다는 트리 노드를 클릭하고 다른 사업부에서 동적 내용을 표시하는 것이 얼마나 쉬운 지. 예를 들어, 다음과 같이 트리 노드 (html_data의 jstree 플러그인 및 struts2 사용) 정의 된 가정하십시오 DO-뭔가 조치가 실행되도록 할 것이다 트리 노드에

<li id="node1"> 
    <a href="do-something.action">Do Something</a> 
</li> 

클릭을하고, 그 결과에 표시됩니다 id가 "content"인 div.

+1

+1! 감사합니다 제프, 그 위대한 작품. –

+0

@Metro Smurf jtree가 프레임 셋의 일부인 것을 제외하고 나는 같은 문제가있다. 그것은 왼쪽 사이드 패널에 있고 링크를 오른쪽 클릭 창으로 대체하기 위해 노드를 클릭하고 싶습니다. 이 문제를 해결하면 lefthandside가 jstree 없이도 제대로 링크됩니다. 어떤 아이디어? –

+0

@PaulTaylor - 나는 모른다. 나는 답을 정리했다. 제프가 물어볼 것입니다. –

관련 문제