녹아웃 관측 가능한 배열의 값이 업데이트되었을 때 jstree를 새로 고치는 방법은 무엇입니까?

Question

HTML 코드 :

<div id="jstree_1"> 
<ul data-bind="foreach: KoObservableArray"> 
    <li data-bind="attr: {type: type}"> 
     <a href="#" data-bind="text: text"></a> 
     <ul data-bind="foreach: children"> 
      <li data-jstree='{"icon":"glyphicon glyphicon-leaf"}' data-bind="attr: {id: id, type: type}"> 
       <a href="#" data-bind="text: text"></a> 
      </li> 
     </ul> 
    </li> 
</ul> 

가 그럼 난 다음 명령을 사용하여 jstree를 구축 할 것입니다 :

$('#jstree_1').jstree({ 
'plugins': ["wholerow", "checkbox"]}); 

모든 먼저 초기화 잘 작동합니다. 그런 다음 우리는 녹아웃 관측 가능한 배열 데이터 (KoObservableArray)를 업데이트하고 새로운 데이터를 반영하기 위해 jstree를 새로 고침해야합니다.

내가 시도 :

이

$('#jstree_1').jstree(true).refresh(); 
$('#jstree_1').jstree("refresh"); 

그러나 그들 중 누구도 나를 위해 작동하지 않습니다. 도움이 내 문제를 데모 할 :(

추가 된 코드 예제 조언을 바랍니다. http://jsfiddle.net/mang/pyh9m7de/7/

을 changeMenu에 클릭 한 후, 나는 Jstree 새로운 데이터를 표현하기 위해 새로 고침 할 것으로 기대.

Answer 1

사용 다시 그리기 (참)

새로 고침는 초기 상태로 돌아갑니다.

Answer 2

괜찮 내가이 문제를 해결하기 위해 관리.

당신은이 개 대안이 :

1) 당신의 jstree의 데이터를 재설정을

$('#jstree_1').jstree(true).settings.core.data = self.KoObservableArray(); 
$('#jstree_1').jstree(true).refresh(); 

크롬과 파이어 폭스에서 작업이 방법,하지만 내 IE :(

2) 추한 해결에 - 모든 브라우저에서 저를 위해 일합니다.

는 HTML에서 jstree를 제거하고 내가 전에 아니지만뿐만 아니라 일하는 것을 시도는 DOM

var elem = document.getElementById('jstree_1'); 
    elem.parentNode.removeChild(elem); 

    var newElement = $("<div id='jstree_1'><ul data-bind='foreach: KoObservableArray'><li data-bind='attr: {type: type}'><a href='#' data-bind='text: text'></a><ul data-bind='foreach: children'><li data-jstree='{'icon':'glyphicon glyphicon-leaf'}' data-bind='attr: {id: id, type: type}'><a href='#' data-bind='text: text'></a></li></ul></li></ul></div>").appendTo("#jstree_parent"); 
    ko.applyBindings(viewmodel, document.getElementById("jstree_1")); 

    $('#jstree_1').jstree({ 
     'plugins': ["wholerow", "checkbox"] 
    });