The change event of the DropDownList is emitted when navigating between DropDownList options using the keyboard.
The DropDownList should have a select event like it is in other Kendo UI suites and this select event should be emitted when using the keyboard with an expanded popup. Once a value is selected with, for example, click or 'Enter' press, then the change event should be triggered.
Currently, the Kendo UI for Vue Native DropDownList doesn't have the valuePrimitive property which is available in the:
Providing such property for the Native Vue DropDownList will be useful in different use-case scenarios.
In the DropDowns DataItems components we may want to render the id-s of the items and take it directly from the items.
<div id="app">
<kendo-dropdown
:data-items="employees" :data-item-key="'id'" :text-field="'text'">
</kendo-dropdown>
</div>
<script>
const app = Vue.createApp({
components: {
'kendo-dropdown': window.KendoVueDropdowns.DropDownList
},
data() {
return {
employees: [
{ id: 182, text: "John" },
{ id: 273, text: "James" },
{ id: 325, text: "Jane" }
]
}
}
});
app.mount('#app');
</script>
Currently, the popup of the DropDownList component opens only at the bottom of the component.
It will be a very nice feature if the Native DropDownList has a property that can configure the popup of the component to appear above its input.
This functionality will also be useful in scenarios where the DropDownList(DDL) is positioned at the bottom of a page. With the current implementation, when the DDL popup is expanded part of its items are hidden by the page borders.