A combobox that uses a grouped datasource does not adhere to WCAG 1.3.1. When a user navigates the options in the combobox popup, the group relationship is established for sighted users but the group is not announced to disabled users.

https://dojo.telerik.com/uJijOcOW/3

Hi,

You prob. already know this, but in Chrome attribute autocomplete should be "disabled" instead of "off" for e.g. combobox - then we don't get the auto fill.

Even thought it has no id nor name - I think it looks at the lavbel - in my case its "Name" and the combobox get a big Chrome auto fill from the address book. Setting it from "off" to "disabled" will disable both auto complete AND auto fill.

The same goes for the AJAX Combobox - will you notify that team too? Current hotfix for that is `$(".rcbInput").attr("autocomplete", "disabled");`

Thanks

/Anders

I have attached a simplified version of my app that reproduces the issue of infinite valueMapper requests.  

Reproduction steps:

1. Open the example htm file 
2. Open the browsers dev tools to the network tab and clear any request that have been logged.
3. Click "Add New Load Stop." Result: A row will added to the list view that contains a combo box and one request to the Orders endpoint will be made.
4. Set a value for the combo box that was added. Result: No additional request will be made if selecting from first few items in the list.
5. Click "Add New Load Stop." Result: A second row will be added to the list view that also contains a combo box, a query to the Orders endpoint will be made, and an infinite number of requests will be made to the ValuMapper endpoint.

This is reproducible in both Edge and Chrome browsers.

Thank you for your help,

Luke 

Hello, 

We have an issue with the combobox widget on chrome for android v77.0..

You can see the demo here https://dojo.telerik.com/aroMevIy.

Steps to reproduce:
1. Run the example in Dojo on chrome for android v77.0.3865.92
2. Scroll down to an item that was not initially visible and select it

The result is that nothing is selected. 
From debugging we saw that the change event on the widget is not fired.

Best regards,
Rostislav

p.s. the Additional Information Version dropdown doesn't have version 2018.1.221 as an option 

I've selected a version on which the bug is fixed!!!

Bug report

Reproduction of the problem

Scenario 1 Cascade with no pre-selected values.
Dojo example: https://dojo.telerik.com/uguXisaY/4

1. Select category “Baverages”, product “Chai” and order “Cunewalde”
2. Change category to "Condiments"

Result:
In R1 2019 the change event fires in disorder (Orders, Categories and Products)
In R3 2019 the change event fires for Categories and Products
In R3 2019 SP1 the change event fires only for Categories

Scenario 2 Cascade with pre-selected values
Dojo example: https://dojo.telerik.com/uguXisaY/10

1. Select category “Condiments”

Result:
In R1 2019 the change event fires for all ComboBoxes but twice for Orders
In R3 2019 the change event fires for all ComboBoxes
In R3 2019 SP1 the change event fires for all ComboBoxes but twice for Products

Scenario 3 Cascade in Grid with no pre-selected items
Dojo example: https://dojo.telerik.com/OpOkataY/9

1. Click Edit and select "BMW" in Brand.

Result:
In R1 2019 the change event fires for all ComboBoxes in inverse order: Year, Model, Brand
In R3 2019 the change event fires only Model and Brand in this order.
In R3 2019 SP1 the change event fires only Model and Brand in this order.

Scenario 4 Cascade in Grid with pre-selected items
Dojo example: https://dojo.telerik.com/OpOkataY/10

1. Click Edit and select "BMW" in Brand.

Result:
In R1 2019 the change event fires for all ComboBoxes in inverse order: Year, Model, Brand, but fires twice for Year
In R3 2019 the change event fires for all ComboBoxes in inverse order: Year, Model, Brand
In R3 2019 SP1 the change event for all ComboBoxes in inverse order: Year, Model, Brand, but fires twice for Year

Current behavior

Expected/desired behavior

Environment

• Kendo UI version: 2019.3.1023
• jQuery version: x.y
• Browser: [all ]

Currently, the "suggest" option of the ComboBox is designed to work only in a combination with 'filter:"startswith"'. If you open this Dojo and enter "T' in the ComboBox, then focus the ComboBox out then the "Two" ComboBox item will be selected.

If in the above demo, we change the filter configuration to "contains", when we enter "T" and focus the ComboBox out, the behavior will be the same, and "Two" will be selected. If we instead of "T" enter "w" and focus the ComboBox out then "two" won't be selected. To make the "Two" item selected, with "filter:'contains'" configuration, we can use the below workaround.

No matter the below workaround, it will be very useful if the below logic or similar one can be built-in in the ComboBox component.

<input id="combobox" />
<script>
var fruit = [
    {code: 1, name: "One" },
    {code: 2, name: "Two"},
    {code: 3, name: "Three"}
];

var ds = new kendo.data.DataSource({
data: fruit
});

$("#combobox").kendoComboBox({
  dataTextField: "name",
  dataValueField: "code",
   suggest: true,
   filter: "contains",
  dataSource: ds,
  change: function(e) {
    var comboBox = $("#combobox").data("kendoComboBox");
    var dataItem = comboBox.dataItem();
    if (dataItem === undefined) {
//special code for mobile browsers to auto select the first entry
if (comboBox.text() != "") {
ds.filter({ field: "name", operator:"contains", value: comboBox.text() });
if (ds.view().length > 0) {
comboBox.select(function(dataItem) {
return dataItem.name === ds.view()[0].name;
});
}
}
    }
  }
});
</script>
<input id="fred">

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?

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!

Bug report

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.

Reproduction of the problem

1. Open the Dojo example - https://dojo.telerik.com/@NeliKondova/EZILudiz
2. Add and use the Chinese language
   
3. Type 'bao' and press space to convert to Chinese
4. Press Tab or Enter to select.

Current behavior

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 (包).

Expected/desired behavior

The items should be selected when using the Chinese IME typing after filtering the data and selecting an item through the keyboard.

Environment

• Kendo UI version: 2023.2.606
• Browser: [all ]

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).

Königlich

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.

Queen

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:

Bon app

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:

Blauer See Delikatessen

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.

Summary

There seem to be several issues here:

1. Alternating between finding a matching value then finding a random value as each character is entered (most prevalent with Königlich).
2. Some options cannot be found via filtering (ex. all but the first above). Not only is it not running Ajax requests to find matches in options that haven't been loaded yet, but it also doesn't appear to find matches in options that have already been loaded via Ajax.
3. Matched option displayed in the wrong location (in most cases the match was displayed first in the list, but in one of the examples above it's in the middle of the list).

Hi,

we found a hard to reproduce bug in the combobox control. It appears infrequently while typing in the combobox input, if the combobox has grouping and the fixed header enabled. It does not seem to have functional implications to the control but it produces a javascript error.

Stacktrace:

_firstVisibleItem: function () {
    for (var t = this.element[0], n = this.content[0], i = n.scrollTop, r = e(t.children[0]).height(), o = Math.floor(i / r) || 0, a = t.children[o] || t.lastChild, s = a.offsetTop < i; a; ) if (s) {
      if (a.offsetTop + r > i || !a.nextSibling) break;
      a = a.nextSibling
    } else {
      if (a.offsetTop <= i || !a.previousSibling) break;
      a = a.previousSibling
    }
    return this._view[e(a).data('offset-index')]
  }

It seems to be a timing problem where the list is already loading again while the scroll from the item selection is not finished.

Working dojo example to reproduce: https://dojo.telerik.com/aMEKuzex/2

If you set the contents of the combobox using the text() method, pressing the "X" inside the ComboBox will not fire a change event.

If you set the contents of the box using the value() method, or through the UI itself, clearing it afterwards does fire the change event, which is the expected behaviour. 

As per https://docs.telerik.com/kendo-ui/api/javascript/ui/combobox/events/select I am expecting that select does not fire when the user enters text but does not select an item from the list. This is consistent with your other widgets like AutoComplete.

However as seen in this dojo https://dojo.telerik.com/ESOJibEB select triggers whenever I enter text and click off the box instead of only when I click an item in the combobox.

How to reproduce:

• Open above Dojo
• Click in the combobox and type some text.
• Do not click on an item in the list and instead just click anywhere else on the page.
• Check console and you will see select has been printed.

If you need any other help, let me know.

Kind Regards,

Ben

PS Im forced to select a browser but this is the same across both chrome and firefox.

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.

Bug report

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

Reproduction of the problem

1. Run this dojo
2. Click on the arrow to open the list of items
3. Navigate through the items using the down arrow key

Current behavior

When the valueMapper function is called the selection moves to the previous item in the list

Expected/desired behavior

Selection should not change when the valueMapper function is called.
Working example with jQuery v1.12.3

Environment

• Kendo UI version: 2020.2.617
• jQuery version: 3.5.1
• Browser: [all]

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
});

Bug report

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.

Reproduction of the problem

1. Go to the ComboBox demo
2. Make a selection in the ComboBoxes
3. Click on any other demo link in the navigation pane to the left (e.g. “Server Filtering”)
4. Press the "Back" browser button

Current behavior

The selections made are not displayed when the page is restored from the Back-Forward Cache

Expected/desired behavior

The selections made should be displayed when the page is restored from the Back-Forward Cache

Environment

• Kendo UI version: 2020.3.915
• Browser: [Firefox 81.0.2]