Ответ 1
Если вы используете JSON_DATA, добавьте class:jstree-checked к объекту attr node:
{
"data": "node name",
"attr": { "id": "node id", "class":"jstree-checked" }
}
Флажок jstree установлен на нагрузке
Я сражаюсь с флажком jQuery jsTree. Хорошо, я узнал, как обрабатывать события при проверке или снятии флажка. Если это полезно, я могу вставить код:
.bind("check_node.jstree", function(e, data)
{
if(data.rslt.obj !== undefined && data.rslt.obj.attr(\'id\') !== undefined)
{
jQuery.ajax({
async : false,
type: "POST",
dataType: "json",
url: "adsmanager/adsfields/ajaxappendcategory",
data:
{
"id" : data.rslt.obj.attr(\'id\'),
"itemId" : "' . Yii::app()->getRequest()->getParam('id') . '",
},
success: function(r)
{
if(r === undefined || r.status === undefined || !r.status)
{
data.rslt.obj.removeClass(\'jstree-checked\');
data.rslt.obj.addClass(\'jstree-unchecked\');
}
else
{
niceBox(\'ok\');
}
}
});
}
return true;
})
С этим все в порядке, но знаю, что я не могу найти где-либо, как проверять флажки на загрузке дерева, например, если я использую jsTree как селектор категорий для своих новостей. Item, когда я создаю новый элемент новостей, все в порядке, и когда Я хочу обновить этот элемент Мне нужно jsTree с выбранными категориями и что я не могу найти какой-либо пример, как выбрать узлы при загрузке jsTree.
Любая помощь с этим вопросом?
Ответы
Ответ 2
Я нашел решение, установив опцию флажка флажка two_state в true
"checkbox" => array( "two_state" => true)
а затем, если вы используете данные Xml, добавьте class="jstree-checked" в params
все отлично:)
удачи;)
Ответ 3
Для текущих данных JSTREE версии 3.2.1 и JSON нам нужно использовать состояние: {checked: true}
и добавьте в конфигурацию для секции флажка
"флажок": { "tie_selection": false }
этот пример отлично работает
data : [
{ "text" : "Root", state : { opened : true }, children : [
{ "text" : "Child 2", state : { checked : true },
]
Ответ 4
Попробуйте следующее:
$("#jstree").jstree(true).load_node('#');
Это сработало для меня.
Вот ссылка:
Ответ 5
Возможно, это поможет вам больше - jstree v1
<script src="@Url.Content("~/Scripts/jquery.jstree.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.cookie.js")" type="text/javascript"></script>
ниже - для проверки и снятия привязки события для jstree
<script type="text/javascript">
$(document).ready(function () {
Refresh();
});
function Refresh() {
var dataId = {};
$('#MainTree')
.bind("before.jstree", function (e, data) {
})
.jstree({
"json_data": {
ajax: {
"url": function (node) {
var url;
if (node == -1) {
url = "";
} else {
var id = $(node).data("id");
url = "?categoryId=" + id;
}
var productId = $("#Product_ProductId").val();
if (!productId) {
url = "/Products/GetTreeData" + url;
} else {
url = "/Products/GetTreeData/" + productId + url;
}
return url;
},
//"url": "@Url.Action("GetTreeData", "Categories")",
"type": "GET",
//"data": JSON.stringify(dataId),
"dataType": "json",
"contentType": "application/json charset=utf-8",
},
progressive_render: true
},
"themes": {
"theme": "classic",
"dots": true,
"icons": true,
"url": "@Url.Content("~/content/themes/classic/style.css")"
},
"types": {
"max_depth": -2,
"max_children": -2,
"valid_children": ["folder"],
"types": {
"default": {
"valid_children": "none",
"icon": {
"image": "@Url.Content("~/gfx/file.png")"
}
},
"folder": {
"valid_children": ["default", "folder"],
"icon": {
"image": "@Url.Content("~/gfx/folder.png")"
}
}
}
},
"plugins": ["themes", "json_data", "ui", "types", "checkbox"]
})
.bind("load_node.jstree", function (event, data) {
var productId = $("#Product_ProductId").val();
if (!productId || productId < 1) {
data.inst.hide_checkboxes();
} else
data.inst.change_state('li[selected=selected]', false);
})
.bind("check_node.jstree", function (e, data) {
var productId = $("#Product_ProductId").val();
if (!productId)
return;
$.post(
"@Url.Action("ProductCategoriesSaveData", "Products")",
{
"ProductCategory.ProductId": productId,
"ProductCategory.CategoryId": $(data.rslt.obj).data("id")
},
function (r) {
//Display message if any
if (r.Message) {
alert(r.Message);
}
//Display error if any
if (r.ValidationError) {
$.jstree.rollback(data.rlbk);
alert(r.ValidationError);
} else {
if (r.NewCreatedId) {
$(data.rslt.obj).data("mapId", r.NewCreatedId);
}
}
});
})
.bind("uncheck_node.jstree", function (e, data) {
var productId = $("#Product_ProductId").val();
if (!productId)
return;
var mapId = $(data.rslt.obj).data("mapId");
$.ajax({
async: false,
type: 'POST',
url: "@Url.Action("ProductCategoryDelete", "Products")",
data: {
"id": mapId
},
success: function (r) {
//Display message if any
if (r.Message) {
alert(r.Message);
}
//Display error if any
if (r.ValidationError) {
alert(r.ValidationError);
} else {
data.inst.refresh();
}
}
});
});
}
</script>
Серверная сторона Asp.net MVC
Ответ 6
"state" : { "selected" : true } Делает выбранный флажок
$('#frmt').jstree( {
'core' : {
'data' : [{
"text" : "root text",
"state" : { "opened" : true } ,
"children" : [{
"text" : "child text",
"id" : "idabc",
"state" : { "selected" : true } ,
"icon" : "jstree-file",
}]
},
]},
'checkbox': {
three_state: true
},
'plugins': ["checkbox"]
});