Как обновить узел ajax при нажатии?

Есть несколько узлов, которые получают данные от вызова AJAX в моем jsTree.

Как я могу обновить данные, а НЕ перезагрузить все дерево?

  • лучше всего просто щелкнуть узел, который я хочу обновить
  • контекстное меню тоже нормально

person Radek    schedule 04.08.2011    source источник
comment
Хорошо, что вы не спросили, КАК ПЕРЕЗАГРУЗИТЬ ПО НАЖАТИЮ. ВЫ НИКОГДА НЕ НАЙДЕТЕ ЭТОГО.   -  person Netside    schedule 09.09.2020


Ответы (1)


Как насчет этого?

<html>
<head>
<script language="javascript" type="text/javascript" src="jquery.min.js"></script> 
<script language="javascript" type="text/javascript" src="jquery.jstree.js"></script>
<script>
var treeConfig = { 
  "json_data" : {   
  "data" : [{
      "data" : "Root",
      "state" : "closed",
      "children" : ""
      }],
  "ajax" : {
      "url" : "http://localhost/tree.json",
      "data" : function (node) {                        
          return { query : "Value" };
      }
    } 
  },
  "plugins" : [ "themes", "json_data", "ui" ],
};

$(document).ready(function(){
 $("#treeContainer").jstree(treeConfig);

 $('#treeContainer a').live('click',function(){
    var tree = jQuery.jstree._reference("#treeContainer");
    var currentNode = tree._get_node(null, false);
    tree.refresh(currentNode);
 });

});
</script>
</head>

<body>
 <div id="treeContainer"></div>
</body>
</html>

Вот что я делаю:

  • с помощью подключаемого модуля данных JSON (но концепция аналогична для подключаемых модулей HTML и XML)
  • загрузка начального узла дерева ("Root") из объекта конфигурации данных
  • установка объекта конфигурации AJAX, чтобы все другие узлы запрашивали свои дочерние данные через ajax при первоначальном открытии (применяется к любому узлу, где «состояние» «закрыто», а «дочерние элементы» «пусто»)
  • используя функцию данных AJAX для передачи правильной строки запроса, чтобы получить соответствующие данные для открываемого узла. Мой пример всегда получает http://localhost/tree.json?query=Value, но вы, вероятно, захотите сделать что-то вроде установки значения для идентификатора узла, чтобы сервер отправлял соответствующие данные.

Пока это делает запрос ajax для данных узла только при первом открытии узла. Последний шаг:

  • создайте функцию щелчка, которая заставляет один узел обновлять свои данные каждый раз, когда он нажимается
person mtmacdonald    schedule 13.09.2011
comment
это не работает для меня. Я хочу, чтобы по запросу пользователя можно было снова выполнить вызов ajax. Ваш код этого не делает. - person Radek; 14.09.2011
comment
Я улучшил свой пример, чтобы показать полную конфигурацию jstree, и добавил подробные комментарии. Это работает на моем тестовом сервере. - person mtmacdonald; 14.09.2011
comment
Прекрасно работает. Спасибо тебе за это. - person Radek; 15.09.2011