Hi,
Is it possible to implement a filter in a multiSelectTree so that when a search term matches a parent item, it automatically displays all of its children as well?
example:
For instance, if one were to search for "decor," would the system also show "Bed Linen," "Curtains & Blinds," and "Carpets"?
Thanks in advance,
Ziggy
Is it possible to prevent the user from clicking (selecting) a parent node, but still allow selection of any children. Or ideally change the behaviour of the parent node to expand / collapse the node. The current behaviour of the DropDownTree is that all children are selected, and I don't want this, only a single (child)node should be selectable
So in the example below, the user can select on Apple, Orange etc, but not Fruit / Vegetable
- Fruit
I'm experiencing severe clashes when using native packages with the DropDownTree wrapper. I was only using the wrapper packages before and everything was working fine, however now that I added the native grid to the app the wrapper DropDownTree is giving me Uncaught ReferenceError: jQuery is not defined
I remove all non standard code and still it comes out like the CSS is never applied on top of some other broken stuff.
I'm on VueJS 2.7.14
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-drawing": "^1.17.3",
"@progress/kendo-dropdowntree-vue-wrapper": "^2023.1.117",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-svg-icons": "^1.1.1",
"@progress/kendo-theme-default": "^6.0.3",
"@progress/kendo-ui": "^2023.1.117",
"@progress/kendo-vue-animation": "^3.8.1",
"@progress/kendo-vue-data-tools": "^3.8.1",
"@progress/kendo-vue-dateinputs": "^3.8.1",
"@progress/kendo-vue-dropdowns": "^3.8.1",
"@progress/kendo-vue-excel-export": "^3.8.1",
"@progress/kendo-vue-grid": "^3.8.1",
"@progress/kendo-vue-indicators": "^3.8.1",
"@progress/kendo-vue-inputs": "^3.8.1",
"@progress/kendo-vue-intl": "^3.8.1",
"@progress/kendo-vue-popup": "^2.7.3"
I used these packages before and everything was fine:
"@progress/kendo-dropdowntree-vue-wrapper": "^2021.3.1207",
"@progress/kendo-licensing": "^1.2.1",
"@progress/kendo-theme-default": "^4.43.0",
"@progress/kendo-ui": "^2021.3.1207"
If anyone could tell me how to use the css file from @progress/kendo-theme-default": "^4.43.0" inside a component I think that would solve my problem.
We have a Vuejs app that is using the Kendo DropDownTree control, with checkboxes, to display a hierarchy of data.
The problem is, there is a difference with how the control returns the checked IDs when the parent node is expanded VS collapsed.
To illustrate the problem:_parent1
Is there a way to get all the checked IDs from "$event.sender._values" whenever any node is checked?
Here is how my dropdowntree is configured along with the change function:
<dropdowntree
We have a Vuejs and Vuetify application.
We are using the DropDownTree control to display a hierarchy. In some cases, the list can be very long and scrolls off the page.
I tried using the "Height" property. This works for the DropDownTree controls that are NOT in a v-dialog.
But one of our DropDownTree controls displays in a v-dialog. The "Height" property has no effect here.
How can I make the "Height" property work for the DropDownTree in a v-dialog?
Or how can I specify a height for the DropDownTree or add scroll bars when the DropDownTree appears in a v-dialog?
We are using the kendo-ui Dropdowntree control in our VueJS app.
If we have around 1100+ rows of data in our hierarchy, we find that the Browser screen freezes until the Dropdowntree control is finished populating.
Most of our hierarchies are much smaller and the control populates quickly as expected.
But we have 1135 rows in our hierarchy in one of our examples. The data is fetched from our API and returned to our Vuejs app, in a few seconds. But after the Vuejs load function finishes and the code is about to return to the UI, the screen freezes for about 10 seconds while the Dropdowntree control is populating. Nothing can be clicked while the screen is frozen.
How can we avoid the screen freezing while the Dropdowntree control is populating where the hierarchy rows are large?
I've basically took the example stackblitz from the dropdowntree wrapper:
https://www.telerik.com/kendo-vue-ui/components/dropdowntree-wrapper/checkboxes/
And I added:
<script src="https://kendo.cdn.telerik.com/2019.1.115/js/kendo.all.min.js"></script>
and
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
https://stackblitz.com/edit/8ahikr?file=public%2Findex.html
Unfortunately, due to constraints, I can't upgrade the kendo.all.min.js bundle to 2021, or downgrade the jQuery version to 1.12.1
Is there a Kendo DropDownTree npm package version that works with both jQuery 3.5.1 and 2019.1.115 kendo.all.min.js? Or is this a bug that can be fixed?
Thanks in advance
How do I save the value from this dropdowntree component onChange?:
https://www.telerik.com/kendo-vue-ui/components/dropdowntree-wrapper/
With the multiselect and dropdownlist components I can use
e.sender.dataItems();
and
e.sender.dataItem(e.sender.select());
respectively
But for the dropdowntree component there isnt't a dataItem attached to the event sender object.
Is there a way to disable just the checkbox in the dropdowntree? I need to be able to select and drill down in each node, but also need some checkboxes to be disabled. So a node could be disabled, but I would still like to drill down and select items inside that node that are enabled.
"myDataSource" has a "isEnabled" property that is set to true or false.
How can I disable just the checkbox in the control below
<dropdowntree
:data-source="myDataSource"
tagMode="single"
:autoClose=false
:checkboxes-check-children="true"
:check-all="true"
dataTextField="text"
dataValueField="id"
style="width: 100%;"
height="auto"
>
</dropdowntree>