Bug report

Reproduction of the problem

https://dojo.telerik.com/umOWEMEx

1. Drag and drop Company Name to the group area, to make the grid group by Company Name

2. Reorder Contact Info next to Company Name by drag and drop the column header (from unlocked to locked)

3. Reorder Contact Info back to original place (from locked to unlocked)

Current behavior

The header of Contact title is showing at the left side of Company Name

Expected/desired behavior

The header of Contact title is showing under Contact Info

Bug report

When the number of groups is less than the page size count the grid does not display the entire set of groups

Reproduction of the problem

Run this dojo - https://dojo.telerik.com/@efb@qad.com/eCizuraT

Current behavior

Only a subset of the groups is displayed

Expected/desired behavior

All the groups should be displayed

Environment

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

Bug report

When the scrollable option of the Grid is set to "virtual: 'columns'", the reordering of the columns cannot be performed while dragging over the field headers.

Regression introduced with 2022.3.913

Reproduction of the problem

1. Open the Dojo example - https://dojo.telerik.com/AMeHorIC/3
2. Try to reorder the columns while dragging over the field headers.

Current behavior

The columns cannot be reordered from the field headers. Instead, the field headers are flickering.
Screen recording - https://screenpal.com/watch/c0jrQ2Vpr8e
If the reordering is performed below the headers, it works properly.

Expected/desired behavior

Should be able to reorder the columns from the field headers without flickering.

Environment

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

Bug report

In a Grid with popup editing, saving/cancelling the changes shows hidden columns for a short time.

Regression with v 2023.2.829

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/icarOBim/6
2. Open the browser console
3. Edit a field and press the save button

Current behavior

The hidden ID column is shown for a short time

Expected/desired behavior

The hidden column should remain hidden

Environment

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

Bug report

When there is a sticky column in Grid and the column is unsticked, it can not be dragged for reordering.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliKondova/uXOhUQOJ
2. Unstick ShipName column
3. Try to drag it for reordering

Current behavior

The column can not be dragged and reordered

Expected/desired behavior

It should be possible to reorder the column after it is unsticked.

The issue is a regression starting with the 2023 R1 SP1 2023.1.314 release

Environment

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

Bug report

The rendering of the Grid header for a command column is different than the one for the default header.

Regression introduced with 2023.3.1114

Reproduction of the problem

1. Open the following Dojo example - https://dojo.telerik.com/@Zornitsa/aTIxApiV/3
2. Inspect the HTML of the Grid headers

Current behavior

• Rendering of default header:

• Rendering of command header:

Expected/desired behavior

The rendering of both headers should be the same.

Environment

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

Bug report

In a navigatable Grid with a custom ComboBox cell editor, clicking the clear button closes the cell instead of clearing the value in the ComboBox.

Regression introduced with 2023.2.606

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/OgEBOGoz/2
2. Edit a cell
3. Click the ComboBox clear button

Current behavior

The cell exits the edit mode when the button is clicked and the value is not cleared

Expected/desired behavior

The cell should remain in edit mode and the value should be cleared

Environment

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

See this Kendo Forum post:
http://www.telerik.com/forums/multi-select-in-responsive

In short, we need additional approaches to grid multi select using touch events

Bug report

When the loaderType is set to skeleton and the user edit the cells in the Grid, when saving the Grid is displayed empty.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliK/AGATEWAR
2. Edit a record and click the 'Save changes' button.

Current behavior

The Grid does not display any data. The Grid is displayed as expected when the default loaderType is set.

Expected/desired behavior

The updated data should be displayed

The issue is a regression introduced with 2024.1.319 version

Workaround - https://dojo.telerik.com/@NeliK/OyIXIHuJ

sync: function(e){
           $("#grid").data('kendoGrid').refresh()
 },

Environment

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

I am trying to change the menu option for a column from false to true and others from true to false when a user selects an item from a dropdown. This isn't working. I'm using getOptions(), changing the menu setting in each column, and then setOptions(options) to set it.

Here is a dojo showing an example. In the example, firstName and lastName are initially hidden. I simulate a user choosing last name from some sort of selector (like a dropdown box). The code should then hide both name columns and unhide the lastName column. Instead it hides both name columns.

It seems to have something to do with setting any of the name columns to hidden on initialization. If I remove this from the column settings on initialization though it only works once and when I choose a different option from the dropdown (dropdown is simulated in the dojo so you can't try this but trust me) it breaks.

<html>
<head>
  <meta charset="utf-8">
  <title>Untitled</title>

  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.1.412/styles/kendo.common.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.1.412/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.1.412/styles/kendo.default.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.511/styles/kendo.mobile.all.min.css">

  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2021.2.511/js/angular.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2021.2.511/js/jszip.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2021.2.511/js/kendo.all.min.js"></script></head>
<body>
  <div id="myGrid"></div>
  
  <script>
    let tableRows = [
      {
        ID: 1,
        FirstName: "John",
        LastName: "Smith",
        Age: 21
      },
      {
        ID: 2,
        FirstName: "Jenny",
        LastName: "Jones",
        Age: 18
      },
      {
        ID: 3,
        FirstName: "Greg",
        LastName: "Adams",
        Age: 23
      }
    ];
    
   let tableColumns = [
              {
                title: "Employee ID",
                field: "ID",
                width: 100,
                locked: true,
                menu: false
              },
            {
                title: "First Name",
                field: "FirstName",
                width: 150,
              hidden: true,
              attributes: { "class": "name" },
                
            },
            {
                title: "Last Name",
                field: "LastName",
              hidden: true,
                width: 150,
                attributes: { "class": "name", "data-position": "last name" },
                
            },
            {
                title: "Age",
                field: "Age",
                width: 100
            }
        ];

            var grid = $(`#myGrid`).kendoGrid({
            dataSource: {
                data: tableRows,
                schema: {
                    model: {
                        id: "ID",
                        fields: { ID: {type: "number"}}
                    }
                }
            },
            dataBound: function (e) {
                if (e.sender.dataSource.view().length == 0) {
                    var colspan = e.sender.thead.find("th").length;
                    //insert empty row with colspan equal to the table header th count
                    var emptyRow = "<tr><td colspan='" + colspan + "'></td></tr>";
                    e.sender.tbody.html(emptyRow);
                    e.sender.table.width(800);
                }
     
            },
            columns: tableColumns,
              columnMenu: true,
            sortable: true,
            pageable: false
        }).data("kendoGrid");
    
    let options = grid.getOptions();
    let columns = grid.columns;
    let nameColumns = $(".name");
    let lastNameColumn = $("[data-position='last name']");
    let lockedColumnCount = 0;
    for (var i = 0; i < columns.length; i++) {
        if (columns[i].locked) {
            lockedColumnCount++;
        }
    }
    $.each(nameColumns, function (index, element) {
        let elementIndex = $(element).index() + lockedColumnCount;
        //kendoGrids[tableId].showColumn(elementIndex);
        options.columns[elementIndex].menu = false;
        options.columns[elementIndex].hidden = true;
    });
    
    // Let's pretend Last Name was chosen from a select box part of name to show.
    $.each(lastNameColumn, function (index, element) {
        let elementIndex = $(element).index() + lockedColumnCount;
                        options.columns[elementIndex].menu = true;
                        options.columns[elementIndex].hidden = false;
                        //kendoGrids[tableId].showColumn(elementIndex);
                    });
                    
    console.log(options);
                    
                    grid.options = options;
                    grid.setOptions(options);
    
  </script>
  
</body>
</html>

Hello,

we have the following problem:

In the dojo https://dojo.telerik.com/uJUGEQuh clicking on a row from the skleton loader in the grid causes an error. It seems like you want to access the "id" field from the datasrouce model which doesn't exist in the loading animation.

model:
{
	id: "Id",
	fields: 
	{
		ProductName: { type: "string" },
		Id: { type: "number" }
	}
}

If you rename the "id" field to for exmaple "XXXX" the error message changes

from:

Uncaught TypeError: Cannot read properties of undefined (reading 'Id')

to:

Uncaught TypeError: Cannot read properties of undefined (reading 'XXXX')

We attached a gif of the problem and the code snipped of the dojo. The browser is Chrome Version 109.0.5414.120 (Official Build) (64-Bit)

Greetings

Ingo E.

Bug report

When filtering is enabled in the Grid, the autoFitColumns method does not work.

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/AsaNeqOc
2. Compare the column width of the two Grids

Current behavior

The filterable Grid's columns are not auto-fitted

Expected/desired behavior

The filterable Grid's columns should be auto-fitted

Environment

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

Bug report

With the introduction of the Columns tools in the Grid toolbar, if the columnMenu is set to tabbed, the menu is missing the Column Visibility and Autosize options.

Regression introduced with 2024.1.130

Reproduction of the problem

1. Open this demo - https://demos.telerik.com/kendo-ui/grid/column-menu
2. Open the Column Menu

Current behavior

The Column Visibility and Autosize options are missing

Expected/desired behavior

The Column Visibility and Autosize options should be visible.

Environment

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

showColumn() and hideColumn() is great, but it would be nice if we could pass multiple columns to the methods (maybe as an array).

It's extremely slow if I create a loop and call show/hideColumns(x) multiple times.

This would ideally apply to any grid component (Kendo Grid and TreeList).

When performing a grid refresh, the grid re-renders the all the grid rows. 
I think it would be very efficient to have a choice to render specific, changed rows. 
This is valuable if the grid has many items (200 items for example).

Bug report
Row filter Clear icon does not clear the autocomplete in Grid since 2022.1.119

Reproduction of the problem
Open the demo: https://demos.telerik.com/kendo-ui/grid/filter-row

Expected/desired behavior
AutoComplete shall be cleared

The issue is introduced with 2022 R1 (2022.1.119)
Environment
Kendo UI version: 2022.1.119 or above
Browser: [all]

Consider the following scenario: There is a sortable Kendo-UI grid with a corresponding dataSource. Initially, the dataSource contains some items. When updating the dataSource to an empty array, all items disappear from the grid - so far, so good. However, if a column header is clicked afterwards to sort that column, the removed data reappears again.

We created a small "walkthrough" in this DOJO to demonstrate the issue.

FYI: The issue can be avoided by using a custom implementation of dataSource.transport.read which always returns the latest data.

Bug report

Grid throws error when partial update is executed and selection is persisted

Reproduction of the problem

1. Open the following dojo.
2. Select a row.
3. Place it into edit mode.
4. Make some changes and click on the Save command button.
5. Try to select another row.

Current behavior

The Grid throws an error when the partial update is executed and the selection is persisted.

Expected/desired behavior

The Grid should not throw an error when the partial update is executed and the selection is persisted.

Environment

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

Bug report

When the selectable option is set to "multiple cell" and the user tries to select the content of a single column, the content of the entire row is selected.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliK/AzirANuT
2. Try to select the text in the France cell and drag down to select only the content in the ShipCountry column.

Current behavior

The content of the other columns is selected as well - https://somup.com/cZeXIvpRzk

Expected/desired behavior

The behavior is expected when the allowPaste option is enabled. However, once the allowPaste option is disabled only the content of the selected column should be selected.

Workaround

kendo.ui.Selectable.fn._allowPreventDefault = () => true;
Dojo - https://dojo.telerik.com/@NeliK/eTocoBOL

Environment

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

Steps:

1. https://dojo.telerik.com/URaJeSEk
2. Click the "Change Price" button

Expected: kendoConsole logs the dataItem info in the top message
Actual: dataItem() doesn't find the model even though it exists in the Grid dataSource

In the Grid source code in the refresh function, _data is set to dataSource.view() if partialUpdate is true. For a grouped dataSource, view() will return the parents. This breaks the dataItem function since it relies on the flat array for retrieval.

It looks like this issue was introduced in version 2024.1.319 as it doesn't seem to affect 2024.1.130.