Progress® Kendo UI® for jQuery Feedback Portal
Back to Feed
Request a Feature Report a Bug
Unplanned
Last Updated: 09 Oct 2020 13:00 by ADMIN
Dan
Created on: 02 Oct 2020 16:39
Category: ComboBox
Type: Bug Report
0
ComboBox displays "undefined" for list items if bound objects contain "data" field

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

1 comment
ADMIN
Aleksandar
Posted on: 09 Oct 2020 13:00

Hello Dan,

Behind the scene, the ComboBox uses templates to render the times in the popup. When you have a field named "data" the ComboBox would use it to search for the field of the data item configured as dataTextField, instead of searching the complete parent item, thus the observed behavior. One way to resolve the observed behavior is to provide a template configuration:

var dummyData = [
        {
          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: {}
        }
      ];
      $("#combobox").kendoComboBox({
        dataSource: dummyData,
        dataTextField: "description",
        dataValueField: "key",
        template:"#=description#"
      });

Here is an example of the above.

Regards,
Aleksandar
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

Create an account Log In
View
Type
Status
Category