The TreeView rendering in UI for ASP.NET MVC and UI for ASP.NET Core are not consistent. Setting the Id
configuration for an item in UI for ASP.NET MVC renders a data-id
attribute, that is missing in UI for ASP.NET Core.
@(Html.Kendo().TreeView()
.Name("treeview-kendo")
.TemplateId("treeview")
.Checkboxes(c=>c.CheckChildren(true))
.Items(treeview =>
{
treeview.Add()
.Text("My Documents")
.Id("MyId1");
treeview.Add()
.Text("My Documents 2")
.Id("MyId2");
})
)
When using the UI for ASP.NET Core the rendered <li>
element does not have the data-id
attribute that is present in UI for ASP.NET MVC
<li role="treeitem" class="k-item k-treeview-item k-first" data-uid="a3c937fd-1c4a-46a6-81e1-e53e1a2aeb6e" aria-checked="false" aria-selected="false" aria-expanded="false" data-expanded="false" aria-setsize="2" aria-level="1">
<div class="k-treeview-top k-treeview-top">
<span class="k-checkbox-wrapper" role="presentation">
<input id="_a3c937fd-1c4a-46a6-81e1-e53e1a2aeb6e" aria-hidden="true" type="checkbox" tabindex="-1" class="k-checkbox k-checkbox-md k-rounded-md">
</span>
<span class="k-treeview-leaf k-in">
<span class="k-treeview-leaf-text">My Documents</span>
</span>
</div>
</li>
Rendering should be consistent and the data-id
attribute added in UI for ASP.NET Core.
Use the HtmlAttributes
configuration to add the data-id
attribute
treeview.Add()
.HtmlAttributes(new {data_id = "MyId1"})
.Text("My Documents")
.Id("MyId1");
### Bug report
The attributes set through the "HtmlAttributes", "ContentHtmlAttributes", and "LinkHtmlAttributes"methods are not applied to the TreeView items.
### Reproduction of the problem
1. Create a TreeView and set attributes by using the "HtmlAttributes", "ContentHtmlAttributes", "LinkHtmlAttributes"methods:
@(Html.Kendo().TreeView()
.Name("treeview-kendo2")
.Items(treeview =>
{
treeview.Add().Text("My Documents")
.SpriteCssClasses("k-icon k-i-globe")
.Expanded(true)
.Url("/")
.HtmlAttributes(new { @class = "fairydust1" })
.ContentHtmlAttributes(new { data_navigate = "navigate_content", @class = "trigger", title = "content_title" })
.LinkHtmlAttributes(new { data_navigate = "navigate_link", @class = "trigger", title = "content_link" });
})
)
2. Run the page and inspect the TreeView item.
### Expected/desired behavior
The attributes are serialized and rendered.
### Environment
* **Kendo UI version: 2021.2.616
* **jQuery version: 1.12.4
* **Browser: [all]
The parent node's state remains "unchecked".
The parent node's state should be "indeterminate".
Workaround:
Attach a DataBound event handler to the TreeView:
<kendo-treeview name="DataRestrictionTree" load-on-demand="false" datatextfield="Name" on-data-bound="onDataBound" >
In the handler call the TreeView's updateIndeterminate API method:
function onDataBound(e) {
var treeview = $("#DataRestrictionTree").data("kendoTreeView");
treeview.updateIndeterminate();
}