проблемы с jsTree
Доброго времени суток!
Пытался разобраться сам с этим плагином, но так как знаний javascript не хватает для этого, решил обратиться к знающим людям. Сам я программирую на ActionScript, и я слышал, что эти два языка похожи. Мне нужно создать дерево, с подгрузкой данных с сервера, и вставить checkbox`ы, и после того как пользователь отметил какие-нибудь элементы дерева. Сохранить эти данные. Читал документацию, но она мне мало чем помогла. Непонятно еще то, что настройки прописываются разными способами. И какой из них подойдет для меня неизвестно. На данном этапе удалось сделать само дерево, которое берет данные с сервера. Фрагмент кода файла test.php echo '[{ "data" : "Parent", "children" : [ { "data" : "Component", "state" : "closed" } ], "state" : "closed" }, "asdas"]';
Сам код javascript $(function () {
$("#demo").jstree({
"plugins" : ["themes", "json_data", "checkbox"],
"json_data" : {
"ajax":{
"url": "testClass.php",
"data" : function (n) {
return {
"operation" : "get_children",
"id" : n.attr ? n.attr("id").replace("node_","") : 1
};
}
}
}
});
});
Возникает вопрос, что возвращает функция в data? И "operation" : "get_children" - это вызов какой-то функции из самого плагина? Или это отправляется на сервер? Быть может есть подробная документация по этому плагину? Разбор демонстрации для такого новичка как я не подходит. Буду очень рад если кто-нибудь мне поможет, в ответ могу только предложить помощь по ActionScript!:) |
Вроде с подгрузкой данных разобрался, добавил checkbox`ы. Теперь появился вопрос, можно ли отслеживать изменения состояния checkbox`а, и сразу отсылать через ajax данные на сервер?
|
Или такое невозможно?
|
Попробовал написать в настройках jstree такой вариант
.bind("change_state.checkbox.jstree", function (e, data){
//alert(data);
})
После просмотра всех свойств объекта data, нашел строку со списком, но никак не могу выделить id выбранного элемента, хотя при открытии jstree в демо, есть строка .bind("create.jstree", function (e, data) {
$.post(
"./server.php",
{
"operation" : "create_node",
"id" : data.rslt.parent.attr("id").replace("node_",""),
"position" : data.rslt.position,
"title" : data.rslt.name,
"type" : data.rslt.obj.attr("rel")
},
function (r) {
if(r.status) {
$(data.rslt.obj).attr("id", "node_" + r.id);
}
else {
$.jstree.rollback(data.rlbk);
}
}
);
})
"id" : data.rslt.parent.attr("id").replace("node_","") - как я понял здесь находиться id объекта, но в моем случае в объекте parent вообще нет никаких свойств. |
по документации -- http://www.jstree.com/documentation
В JSON-ответе кроме свойства data еще передавайте св-во attr -- а там уже все атрибуты, которые необходимо добавить элементу дерева |
Спасибо, е1f!
Мне еще нужно как-то сохранять выбранные пользователем варианты. У меня задача такая, пользователь выбирает товары, которые представлены в виде дерева, и после того как он пометил checkbox`ы, кликает кноппку "сохранить", и выбранные товары нужно сохранить в базе данных. Но я никак не могу добраться до этого checkbox`a, чтобы узнать его состояние. В документации мало, что написанно про эти checkbox`ы. Я пробовал такой код .bind("change_state.check_box.jstree", function (e, data){
alert(data.args[0].attr("id"));
})
При раскрытии ветки дерева, у меня выводит сообщение какой это id, но при изменении состояния чекбокса, происходит ошибка. Быть может есть более легкий способо решить такого рода задачу? |
1. Вот тут смотрели?
2. Что это за тэг "change_state"? 3. Давайте небольшой, демонстрирующий проблему, пример, желательно доступный по внешней ссылке "на посмотреть". |
Из-за не знания языка js, я даже не знаю, что это за bind(). Как я предполагал, эта функция отслеживает события дерева. Пример у меня на локалке, впринципе я его составил из примера, который идет в комплекте с jsTree.
|
Вообще с помощью jsTree v 1.0rc2 возможно решить такую задачу? Или я зря трачу время?
|
Цитата:
Цитата:
|
C сохранением состояния чекбокса в базе данныхя разобрался, но вот теперь не могу понять как загружать это состояние оттуда не пойму. В примере есть такой php-код
foreach($tmp as $k => $v) { $result[] = array( "attr" => array("id" => "node_".$k, "rel" => $v[$this->fields["type"]]), "data" => $v[$this->fields["title"]], "state" => ((int)$v[$this->fields["right"]] - (int)$v[$this->fields["left"]] > 1) ? "closed" : "", "language" => "ru" ); } return json_encode($result); "language" => "ru" - это уже я добавил, вроде работает. Но, какой параметр отправить, чтобы checkbox'у было установлено сохраненное состояние, не знаю. Уже писал "checkbox" => "checked", для теста, но не помогло. |
Спасибо всем большое, я разобрался с этими checkbox`ами, тему можно закрыть.
|
сам парюсь с jstree
там есть такое (в основном примере)
$(function () {
// 6 create an instance when the DOM is ready
$('#jstree').jstree();
// 7 bind to events triggered on the tree
$('#jstree').on("changed.jstree", function (e, data) {
console.log(data.selected);
var podrid = data.selected; //data.selected - ид текущего узла
});
// 8 interact with the tree - either way is OK
$('button').on('click', function () {
$('#jstree').jstree(true).select_node('child_node_1');
$('#jstree').jstree('select_node', 'child_node_1');
$.jstree.reference('#jstree').select_node('child_node_1');
});
});
а сам хочу при помощи jstree обратиться к определенному узлу, перейти на него. может кто подскажет как ? |
| Часовой пояс GMT +3, время: 14:15. |