Context:
- Load on demand enabled
- Check Children is set true
- Remote api call to load data.
- Attached sample code is using kendo services.
Issue or Scenario:
When you select the top node or checkbox, it shows 1 item(s) selected. However, when you expand and deselect child nodes or checboxes, the single tag message will removed and blank field is present.
please find below code and attached gif file, these files will give you clear understanding on the issue with dropdowntree.
<!--BELOW IS THE CODE SAMPLE ON THIS BUG -->
<!DOCTYPE html>
<html>
<head>
<base href="https://demos.telerik.com/kendo-ui/dropdowntree/remote-data-binding">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.514/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.514/styles/kendo.material.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.514/styles/kendo.material.mobile.min.css" />
<script src="https://kendo.cdn.telerik.com/2019.2.514/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.2.514/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example">
<div class="demo-section k-content">
<input id="dropdowntree" style="width: 100%;" />
</div>
<script>
var serviceRoot = "https://demos.telerik.com/kendo-ui/service";
homogeneous = new kendo.data.HierarchicalDataSource({
transport: {
read: {
url: serviceRoot + "/Employees",
dataType: "jsonp"
}
},
schema: {
model: {
id: "EmployeeId",
hasChildren: "HasEmployees"
}
}
});
$("#dropdowntree").kendoDropDownTree({
placeholder: "Select ...",
dataSource: homogeneous,
height: "auto",
checkboxes: { checkChildren: true },
dataTextField: "FullName",
clearButton: true,
checkAll: false,
autoClose: false,
tagMode: "single",
loadOnDemand: true
});
</script>
</div>
</body>
</html>
I use the below template to render nodes (so that root nodes do not have a checkbox), but when I click checkAll button the root node(s) content are also displayed as selected
You should provide an event to custom handle this behavior and ignore nodes unselectable
.Checkboxes(setting => setting
.CheckChildren(true)
.Template("# if (item.level() > 0) { #" +
"<input type='checkbox' #= item.checked ? 'checked' : '' #>" +
"# item.text = item.SymptomName #" +
"#}else{#" +
"# item.text = item.LocationName #" +
"#}#"
)
)
Keep up the awesome work !
I have a suggestion to improve this, which would be highly appreciated by my customers:
Add a suggest possibility, the same as the suggest possibility that already is available on the combobox.
People start to type in the search box, most of time finding the one option they need, than they first have to select the option (mouse or arrows, plus enter). It would be nice if the result (when it is one result) is already selected and they should have only to press enter.
Please Implement Cleaner "Fully Loaded" Event Instead of Multiple onDataBound Checks as per recommended per this approach: https://docs.telerik.com/kendo-ui/knowledge-base/dropdowntree-fully-loaded
That works fine, but if I have multiple DropDownTree elements on the page, this is a lot of extraneous code. Could this not be encapsulated within the library with a true event?
Perhaps it could be something like "contentLoaded" or "treeeInitialized".
In my case I would then use it to fulfill a Promise or other actions.
Bug report
The DropDownTree validation error message appears when the widget gets opened. The message appears before the user is able to select an item. The behavior is not consistent with the validation of the rest of the widgets, such as DropDownList, for example.
Reproduction of the problem
- Open the Dojo example
- Expand the DropDownTree
Scenario 2: DropDownTree in a Form - Dojo
Current behavior
The DropDownTree is validated on open, thus it is marked as invalid before the user has the possibility to select an item.
Expected/desired behavior
The validation of the DropDownList should be consistent with the rest of the widgets. It should be validated when it is focused out
Environment
- Kendo UI version: 2021.3.914
- Browser: [all ]
Bug report
The DropDownTree's refresh API method re-renders only the noDataTemplate and the footerTemplate. The nodes are not re-rendered.
Reproduction of the problem
Current behavior
Only the noDataTemplate and the footerTemplate are re-rendered.
Expected/desired behavior
The method should also re-render the nodes, similarly to the DropDownList's refresh method, which re-renders its items.
Environment
- Kendo UI version: 2021.1.330
- jQuery version: x.y
- Browser: [all]
It would be nice to have the functionality to dynamically switch tagNodes, this feature would help sort out the issue of expanding the dropdown if many selections have been made .i.e.
It should show like the image below instead
It would also be great to add the feature to auto-select the parent's children and their sub children if the parent is checked.
The workaround for these issues is available on this dojo
Hello Team,
Please refer this DoJo - http://dojo.telerik.com/@SaravanaMS/utINiRUq
We have a dropdowntree component added in a grid and when we collapse the dropdowntree options - dropdowm box stays at top.
Steps to reproduce -
1. open all options from top to bottom
2. collapse the option from bottom to top
3. once the top option is collapsed - dropdown box stays at top