A kendo treeview is looking rather off, as per the attached file.
I'm not sure how to resolve it exactly as I haven't made any changes to markup or styles.
Though, I feel some styles might be overriding the ones that the treeview uses.
In a bower.json file is the following entry in "dependencies":
"kendo-ui": "https://bower.telerik.com/bower-kendo-ui.git#2017.2.907"
The latest 2020 version was trialled, but there were issues with icons. We are running some old stuff. But since recently, the treeview was completely fine.
Does anyone have any suggestions as to what I should look for to see if I can get the styles to work properly?
Currently I have a treeview populated from a datasource that has additional fields. I am using a filter to show checkboxes on the child nodes only (not the top level node). One of those extra fields is called loss. If the loss value is greater than zero I would like to change the text color of the node to red.
My current template is "# if(!item.items){# <input type='checkbox' value='true' />#}#"
How would I do this?
Thanks
Jason
Is there a way to check if the click event on a node had the control key? Unlike the drag/drop events where you can get the original event, I cannot see the same with the select event...
Matt
I have a page where I am adding multiple treeviews dynamically, using a kendo template.
They are created in a loop from a javascript object.
I build the structure (ul, li, etc.), then after creating the multiple tress, run the $(...).kendoTreeView() with checkbox options.
The treeviews are formatted but as single select and not with checkboxes.
I have created an example (https://dojo.telerik.com/otelaBEL/2).
What is going wrong?
I have a TreeView implementation that often contains hierarchies that have large numbers of nodes in very flat structures. While I have drag and drop working, the usability just isn't very good. So, I'm implementing a cut/paste mechanism where the cut simply remembers the unique id of the source node and on paste of the target node, I get the source node using its id and attempt to .append(sourceNode, targetNode).
However, this doesn't seem to work.
Is this the best way to approach this or is there a different way I should approach this?
$("#mnuHierarchyRightClick").kendoContextMenu({
target: "#tvHierarchy",
filter: ".k-in",
select: function (e)
{
switch (e.item.id)
{
case "mnuHierarchyRightClickCut":
var tv = $("#tvHierarchy").data("kendoTreeView");
var dataItem = tv.dataItem(e.target);
self.setClipBoard(dataItem.ID,'Clipboard: ' + dataItem.Text);
break;
case "mnuHierarchyRightClickPaste":
self.paste(e.target);
break;
default:
break;
};
}
});
// called from click on context menu of the TreeView
MyController.prototype.paste = function (targetNode)
{
var self = this;
try
{
var tv = $("#tvHierarchy").data("kendoTreeView");
if (targetNode == null) { return false; }
var targetDataItem = tv.dataItem(targetNode);
var pastedDataItem = tv.dataSource.get(self.ClipBoardPrimaryKeyID);
self.setClipBoard(0,'');
var pastedNode = tv.findByUid(pastedDataItem.uid);
pastedDataItem.set('parentID', targetDataItem.id);
tv.append(pastedNode,targetNode);
}
catch(e)
{
alert(e);
}
}
We just upgraded from Kendo 2016.2 to 2017.2.621 and it's seems like we can't use the setStatusClass from the drag event anymore. The documentation says that the naming convention has changed starting with version 2016.3.914 but I've tried every pattern possible involving the k and the i without success. None of the provided value used enabled the k-denied icon. Also, calling setStatusClass with k-denied use todo the same job as calling a e.setValid(false); on the drop event... this ain't working anymore.
Here's a snippet that reproduce the problem.
var
HDS =
new
kendo.data.HierarchicalDataSource({
error: raiseAjaxErrorWindow,
transport: {
read: {
url: HDS_URL,
dataType:
"jsonp"
}
},
schema: {
model: {
id:
"id"
,
hasChildren:
"hasChildren"
,
data:
"data"
}
}
});
$("#treeview").kendoTreeView({
dataSource: HDS,
dataTextField: "text",
dragAndDrop: false,
select: onSelect,
expand: onExpand,
collapse: onCollapse
});
I'm trying to put a context menu on a treeview. Which is working.But when I use the same code to target another css class (targeting <a> tags it's only showing the first letters of each word)
Hi,
I need to display a tooltip for KendoTreeView when hovered over the checkbox.
HTML
<
div
class
=
"demo-section k-content"
>
<
div
>
<
div
id
=
"treeview"
></
div
>
</
div
>
</
div
>
JavaScript
ruleNames = [{ text: "Rule 1", description: "Rule 1 Hovered upon" },
{ text: "Rule 2", description: "Rule 2 Hovered upon" }]
$("#treeview").kendoTreeView({
checkboxes: {
checkChildren: true
},
check: function (e) {
onCheck(pass);
},
dataSource: [{ text: "List of Rules", expanded: false, items: ruleNames }]
});
I want to display the description text on the tooltip.
Please could your help me out with a demo.
Thanks in advance