I was configuration a directory in a directory by used File Manager.
After that whenever click the sub directory, parent directory move to left (created 'k-treeview-toggle').
What's that?
DEMO: multiple click the 'folder2'
Hi ,
Need to check programmatically (based on condition) level 3 (grand child) or more (gran grand child) nodes.
I am able to check till level 2. But can you help me to check the nodes when we have nodes in more that 2 levels.
The following code works up to 2 level:
var treeview = $("#treeview").data("kendoTreeView");
for (var i = 0; i < nodes.length; i++) {
for (var j = 0; j < nodes[i].items.length; j++) {Hello,
We try load ~3-4000 treenodes to treeview but it is very slow. Building the treeview after the datasource is available is ~2 minutes.
The database query duration is few seconds.
Our code:
$("#tvFormulaTree").kendoTreeView({
template: "#if (item.Clickable) {# <a id='" + "#=item.id#" + "' onclick='handleFormulaTreeViewDblClick(\"" + "#=item.FullPathName#" + "\"" + ");' >#=item.Name#</a> #} else {# #=item.Name# #}#",
name: 'tvFormulaTree',
dataTextField: "Name",
dataSource: dsFormula,
loadOnDemand: false
});
var dsFormula = new kendo.data.HierarchicalDataSource({
transport: {
read: function (options) {
$.ajax({
type: "POST",
url: '@Url.Content("~/DD/GetFilteredTreeDataAsync")',
dataType: 'json',
traditional: true,
contentType: "application/json; charset=utf-8",
success: function (result) {
options.success(result);
}
});
}
},
schema: {
model: {
id: "id",
children: "Children"
}
}
});
Can you help please, how can we speed-up this?
Thank you!
Hello,
I'm new here and I'm trying to figure out how can I drag and drop from a Grid to a TreeView
I found this example http://dojo.telerik.com/eWIgu/2
It's something like this what I want to do, but in the example I can't put an element in a certain node of the TreeView, I just add elements to the data source. So how can I do that? I need your help
PS. I also want to do this with a listbox instead of a grid. That's possible?
Greetıngs. I want to use Kendo jquery UI lazy loading structure and use drag and drop mechanism together. But here some problems arise. For example, files are duplicated when I drag and drop onto a node that hasn't been opened yet. When I manually set the "HasChildren" column, GetNode() runs automatically, resulting in two of the same file with data from the server. Please don't point me to the new version, I have to use this version. Thanks.
function get(data, id) {
if (id == 0) {
options.success([]);
return;
}
if (!id) {
return data;
} else {
for (var i = 0; i < data.length; i++) {
if (data[i].id == id) {
return data[i].items;
} else if (data[i].items) {
var result = get(data[i].items, id);
if (result) {
if (result == null) {
return null;
} else if (result.length == 0) {
return null;
} else {
return result;
}
}
}
}
}
}
function getCurrent(data, id) {
if (id == 0) {
options.success([]);
return;
}
if (!id) {
return data;
} else {
for (var i = 0; i < data.length; i++) {
if (data[i].id == id) {
return data[i];
} else if (data[i].items) {
var result = getCurrent(data[i].items, id);
if (result) return result;
}
}
}
}
function getTreeView() {
return $("#treeview").data("kendoTreeView");
}
//For TreeView Lazy Loading
var service = "/DijitalArsiv/GetNode/";
let getData = new kendo.data.HierarchicalDataSource({
transport: {
read: function (options) {
var currentId = options.data.id;
var child = get(TreeView, currentId);
var currentNode = getCurrent(TreeView, currentId);
if (child) {
options.success(child);
} else {
$.ajax({
url: service,
data: { "id": currentId, "isMainFolder": currentNode.isMainFolder, "path": currentNode.path },
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
success: function (response) {
var data = $.parseJSON(response);
if (data.items != null) {
options.success(data.items);
}
TreeView = getTreeView().dataSource.view();
}
}).fail(function (result) {
options.error(result);
});
}
}
},
serverFiltering: false,
schema: {
model: {
id: "id",
isMainFolder: "isMainFolder",
isDraggable: "isDraggable",
isDroppable: "isDroppable",
hasChildren: "hasChildren"
}
}
});
$("#treeview").kendoTreeView({
template: kendo.template($("#treeview-template").html()),
dataSource: getData,
dragAndDrop: true,
loadOnDemand: true,
dragend: function (event) {
},
drop: function (event) {
var localTreeView = getTreeView();
var movingItem = localTreeView.dataItem(event.sourceNode);
var destinationItem = localTreeView.dataItem(event.destinationNode);
var movingItemParent = localTreeView.dataItem(localTreeView.parent(event.sourceNode));
if (!event.valid) {
event.setValid(false);
return;
}
if (movingItem != null && destinationItem != null) {
if (destinationItem.id == movingItemParent.id) {
event.setValid(false);
return;
}
if (!movingItem.isDraggable) {
event.setValid(false);
return;
}
if (!destinationItem.isDroppable) {
event.setValid(false);
return;
}
if (destinationItem.spriteCssClass != "folder") {
event.setValid(false);
return;
}
if (event.dropPosition == "after" || event.dropPosition == "before") {
event.setValid(false);
return;
}
FileTransfer(movingItem, destinationItem);
} else {
event.setValid(false);
return;
}
},
select: function (event) {
var node = $("#treeview").getKendoTreeView().dataItem(event.node);
$(".nodeIconGroup").css("display", "none")
$("#"+node.uid).css("display", "inherit")
}
})
function FileTransfer(movingItem, destinationItem) {
destinationItem.hasChildren = true;
$.ajax({
url: "/DijitalArsiv/FileTransfer/",
data: { "movingItemID": movingItem.id, "movingPath": movingItem.path, "movingFileName": movingItem.text, "movingFileType": movingItem.spriteCssClass, "destinationItemID": destinationItem.id, "destinationPath": destinationItem.path, "destinationIsMainFolder": destinationItem.isMainFolder },
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
success: function (response) {
if (response.Status) {
movingItem.path = response.destinationPath;
} else {
getTreeView().dataSource.data(FirstData);
TreeView = JSON.parse(JSON.stringify(FirstData));
}
}
}).fail(function (result) {
});
}
Hi,
I am currently integrating the Tree View & context menu in Kendo UI Jquery. I would need to show different set of context menus for different category. Is there a way to do it? For 1st & 2nd level will be different context menu. 3rd level will not have any context menu.
Thanks in advance.
Hello,
I'm my angular app I'm trying to achieve drag and drop from treeview to grid.
I have on the sidebar a list of items in a treeview and what to drag them to the grid. Even if this feature is not provided out-of-the-box, I could implement it if I had on the drop event, the id of the dragged item and the position where it is dropped.
Is this possible?
Thanks in advance
Hi,
I did update project ExampleCSVS2010 to new version of Kendo Windows ver. 2021.3.914
After update I got error for class "ExamplesForm":
The type or namespace name "ExamplesForm" could not
be found (are you missing a using directive or an assembly ....)
Thanks,
Leonid
I am trying to disable the drag/drop within the treeview (as in the user wont be able to move any items anywhere inside the treeview). However I am not coming up with a solution for this issue.
I still want the user to be able to drag/drop an item that's inside the treeview over to my listview box as well as drag/drop it back to the treeview box.
So is it possible to disable the drag/drop feature inside the treeview when keeping the drag/drop from there to my listbox?