I'm getting inconsistent behavior when testing a ComboBox with Virtualization enabled. I've tested with both the ASP.NET Core demo and the jQuery demo. The .NET demo defaults to version 2024.2.514 and the jQuery defaults to the current version (2024.3.806), however I've tested with several different versions in the jQuery demo and they all yielded the same results.
Note: if you're unable to recreate any of the problems below, try refreshing the demo page and trying again. When additional data is loaded into the list via Ajax requests (ex. after scrolling through the list), this can interfere with the tests below. Refreshing will ensure there is no additional data from Ajax requests and only the data that was initially loaded into the list (the first 80 results).
If you copy/paste the value "Königlich" into the textbox, the list of options is displayed with a matching option listed first (everything is working as expected so far):
If you hit backspace, however, the list of options is updated and the first option no longer matches (at all):
If you hit backspace again, the list of options is updated again, and now the matching value is back:
Backspace again, matching option disappears and the bad one is back:
It alternates like this each time you hit backspace, bouncing between a good matching value and a bad one that seems completely unrelated.
If you enter "Q", the list opens and the first option listed matches:
Add a "u" and the first option is no longer the match. However, the matching option is listed halfway down the list. Note that with Königlich above, this was not the case (notice in the screenshots above the first option has a border around it; there was no option in the middle of the list with a border).
Add "ee" ("Quee") and you're left with no more matches:
However, if you open the list and scroll down to 10372, you'll find there is in fact an option for "Queen" available that the previous entry wasn't finding:
If you enter "B", the first option listed is a match. If you add an "o" ("Bo"), you're left with no matches:
But if you scroll down to 10331, there's an option for "Bon app" listed that wasn't matched above:
Same as above. Entering "Bl" finds a match, but "Bla" does not. Open the list and scroll down to 10501 to see the option that should have matched.
There seem to be several issues here:
In a Form that has a ComboBox among other inputs, clicking the reset button only clears the value of the ComboBox.
Regression introduced with 2024.1.319
Only the ComboBox's value is cleared
All inputs' values should be cleared
The ComboBox's popup is misplaced the first time it opens when configured with RTL and autoWidth:true
Regression introduced with 2024.1.130
The popup is misplaced on the first open
The popup should be aligned with the input
Bug report
ComboBox select() does not select after version 2021.3.914 when using a serverFiltering
Reproduction of the problem
Open the Dojo - https://dojo.telerik.com/owUfOLef/4
Expected/desired behavior
The first item shall be selected initially.
Environment
Kendo UI version: 2021.3.914 or newer
Browser: [all ]
When the Chinese IME typing is used and the minLength is set in the ComboBox the items can not be properly selected using the keyboard.
When minLength is defined the item in the ComboBox is not selected, the dataitem is not accessible in the change event handler (screencast). The item is selected as expected if the value is copy pasted (包).
The items should be selected when using the Chinese IME typing after filtering the data and selecting an item through the keyboard.
typedText: function () {
var that = this,
caret = kendo.caret(that.input),
text = that.text();
return caret ? text.substring(0, caret[0]) : text;
},
When the virtualization is enabled, mapValueTo option is set to dataItem and initial value is set in the ComboBox, the cursor is not set at the end of the item.
The loaded value is 'Hungry Owl All-Night Grocers' but the cursor is not set at the end of the text, but at the fifth position in the item.
The cursor should be set at the end of the text.
To say that you have "Cascading ComboBox" functionality is misleading. You do have "Cascading ListBox" functionality - whereas if a value is picked in the parent listbox, the child will populate with a filtered, dependent list. Changing the parent changes the dependent items in the child list box.
However, the difference with ComboBoxes is that the user can also type a value in, if it doesn't appear in the bound dataset. While this does work as expected for the child ComboBox in the cascading example - it DOES NOT work for the parent. If you type a value into the parent, the child ComboBox remains disabled. You should be able to at least type into the child box.
We have a simple need for a Manufacturer / Model selection in two cascading ComboBoxes. If the manufacturer does not exist, we want to be able to allow the user to type it in. Since it's a new manufacturer - there are no associated models in the bound dataset, yet. The dependent child ComboBox should at least be enabled so the user can enter the new model.
This behavior can be experienced in your online example. If you pick a value in the parent, the child refreshes and rebinds accordingly. But if you type in the parent - the child remains disabled. This is a bug, if you intend on maintaining that you have "Cascading ComboBox" functionality.
I was given a "workaround" by your support team - but there are still lingering effects (especially on reloading the form with existing data) that would not be an issue if the cascading combobox implementation was completed properly.
Hi Team,
I would like to request to include in the built-in API the functionality to hide the FixedGroupHeaderTemplate. I like the appearance of the UI for ASP.NET AJAX RadComboBox when it is grouping, and it would be nice if the Kendo UI ComboBox could be configured to have the same look without manipulating CSS and adding extra code to the DataBound event.
Thank you!
When a ComboBox is disabled, if the user tries to select the value by double click, additional new line is added to the selection
In the Demos a new line is added before the value of the ComboBox. When the same Demo is opened in a Dojo, a part from the text above the ComboBox is also highlighted. (screencast)
Only the text in ComboBox should be selected even if the widget is disabled.
The element holding the down arrow icon could be hidden when the ComboBox is disabled. - Dojo
Regression introduced in R1 2020 SP1. Related to #5400
Dojo example.
2 requests are sent to the "read" end point.
1 request is sent to the "read" end point. Note that if the input is cleared with the "clear" button, it works as expected and only 1 request is sent.
ComboBox with HighlightFirst set to false causes the widget to lose its value when navigating to it.
On the second tab navigation to the component, its value is lost and is now equal to the text.
The value of the ComboBox should be preserved.
Pressing the Capslock button when the ComboBox is focused triggers the opening of its dropdown list. The dropdown list opens one time when the Capslock is pressed.
The dropdown list of the ComboBox opens when the Capslock is pressed
The dropdown list of the ComboBox should not open when the Campslock button is pressed
Dojo example.
The ComboBox's value is cleared and the placeholder is displayed.
The Pickers had the same behavior before this issue was closed: #4767
Scenario: 2.
The initial value remains.
When making a selection, navigating to another page, and going back to the initial page, which is restored from the Back-Forward Cache in Firefox, the selection of the ComboBox is not displayed.
The selections made are not displayed when the page is restored from the Back-Forward Cache
The selections made should be displayed when the page is restored from the Back-Forward Cache
If you bind a ComboBox widget to a datasource containing arbitrary objects that contain a "data" field, the dropdown items will be "undefined" instead of the value of the dataTextField. I'm guessing the data field is messing up the template variable.
var formData = [
{
key: '1',
description: 'CT Safety',
formTypeCd: 'S',
data: {foo: '', bar: ''}
},
{
key: '2',
description: 'MR Safety',
formTypeCd: 'S',
data: {foo: '', bar: ''}
},
{
key: '3',
description: 'Medicare > 60 Billing',
formTypeCd: 'I',
data: {}
}
];
$("#forms-combobox").kendoComboBox({
dataTextField: "description",
dataValueField: "key",
dataSource: formData
});
While floating label is available on textbox and maskedtextbox, no feature is available on the combobox, unless you are using Kendo for Angular or Vue. Can we get one for jQuery?
When using jQuery v3.5.1 and using the arrows to navigate through items in virtualized ComboBox a previous item is selected when valueMapper function is called. The behavior is not observed when using jQuery v1.12.3
When the valueMapper function is called the selection moves to the previous item in the list
Selection should not change when the valueMapper function is called.
Working example with jQuery v1.12.3
I'm using the default theme: "@progress/kendo-theme-default": "4.18.2" with some custom overrides.
The generated CSS has the following incorrect rule (because of the unitless zero, see https://www.w3.org/TR/css3-values/#calc-type-checking ):
.k-combobox .k-dropdown-wrap .k-clear-value {
calc( calc( 1.2em + 8px) + 0 + 6px)
}
This rules comes from the following scss:
$picker-icon-offset: calc( #{$picker-select-calc-size} + #{$picker-select-border-width} + #{$input-icon-offset}) !default;
The unitless zero comes from this value:
$picker-select-border-width: 0 !default;
As a result, the "X" in a combobox overlaps the value.