Bug report

copySelectionToClipboard() throws an error when the Grid has hidden column/s

Also if false is passed to the method  - grid.copySelectionToClipboard(false); - not all  GUID columns are copied to the clipboard

Reproduction of the problem
Dojo: https://dojo.telerik.com/OpiBoDaH

Select a row/rows

Click on the Select and copy button

Expected/desired behavior
Error should not be present and copy to clipboard shall copy correct data

Environment
Kendo UI version: [all]
Browser: [all]

Bug report

When the selectable is set to "multiple, row", the default editable mode is enabled and the user tries to edit a cell, the editable cell is not closing

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliK/IxUgEMUP or https://dojo.telerik.com/@NeliK/uyuhOFIK 
2. Edit a cell and click on another cell to edit.

Current behavior

The first time the cell is closed as expected. However, every second edited cell is not closing.

Expected/desired behavior

The edited cell should close.

The issue is a regression starting with the 2024.2.514 version

Environment

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

Reproduction steps: 

Try to expand a group in this dojo:

• https://dojo.telerik.com/aroxoYeB/5 

Workaround: 

Appending the following script right after loading the kendo scripts:

• https://dojo.telerik.com/aroxoYeB/6 

• kendo.ui.Grid.original_groupable = kendo.ui.Grid.prototype._groupable;
  kendo.ui.Grid.prototype._groupable = function() {
      let that = this;
      kendo.ui.Grid.original_groupable.call(that);
      if (!kendo.support.isRtl(that.element)) {
          return;
      }
  
      if (that._isLocked()) {
          that.lockedTable.on("click.kendoGrid", ".k-grouping-row " + "a[class*='-i-caret-alt-right']", that._groupableClickHandler);
      } else {
          that.table.on("click.kendoGrid", ".k-grouping-row " + "a[class*='-i-caret-alt-right']", that._groupableClickHandler);
      }
  }

Bug report

When the Add new Record button is clicked multiple times, the newly added row is not saved, when the 'Save' button is clicked.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliK/adURoNaH
2. Click the 'Add new record' button at least twice.
3. Try to edit the row and click the 'Save' button.

Current behavior

The row freezes and is not closed. If after clicking the 'Save' button the user clicks again the 'Add new record' the row is saved.

Expected/desired behavior

The row should be saved and closed when the 'Save' button is clicked, even if the 'Add new record' is clicked multiple times.

The issue is a regression starting with 2014.1.319 release

Environment

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

Bug report

An error is thrown in the browser console when you navigate to the last Grid page when grouping is enabled.

Regression with 2022.1.301

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/aYInodep/3
2. Expand the Canada group.
3. Navigate to the last page

Current behavior

An error is thrown on the browser console.

Expected/desired behavior

No errors should be thrown in the browser console

Environment

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

Bug report

Copy Paste to Search Panel with `allowPaste` set to `true` in the grid is not working

Regression since 2024.1.130

Reproduction of the problem
Dojo: https://dojo.telerik.com/EnUpigUf/2

Try pasting a value in the Search input

Current behavior
The expand arrow disappears.

Expected/desired behavior
User shall be able to paste values to the search panel

Environment
Kendo UI version: 2024.1.130 or newer

jQuery version: 3.4.1

Browser: [all]

Bug report

When the Grid is grouped and there is a locked column set, the grouping columns and the locked column have incorrect widths.

Reproduction of the problem

1. Open the Dojo example - https://dojo.telerik.com/@NeliK/aYUyeyAS

Current behavior

The width of the locked column is 103px although the configured width is 50px. The grouping columns have a width of 66px although the width applied from the theme is 32px.

Expected/desired behavior

The width of the locked column should be according to the value set in the configuration of the Grid. The grouping column should have a width as applied by the themes.

The issue is a regression starting with R2 2023 SP1 (version 2023.2.718) release.

Environment

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

Bug report

Regression with 2024.1.319

Footer on a scrollable grid with sticky column not aligned when columns are resized

Reproduction of the problem

Dojo: https://dojo.telerik.com/OrIwemEP

1. Resize the column "age"

2. Then resize the column "name", and here is the outcome.

Expected/desired behavior
Fotter shall be aligned with the columns

Environment
Kendo UI version: 2022.1.301 or newer
jQuery version: []
Browser: []

Bug report

In a Grid with locked columns, if the last of the locked columns is non-editable, trying to navigate to the next cell focuses the wrong cell.

Regression introduced with 2022.3.913

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/@martin.tabakov@progress.com/iRAyoCIk
2. Navigate to a cell in the Last Name column
3. Try to navigate to the next cell in the City column

Current behavior

Navigating to the next cell focuses the cell in the City column on the next row.

Expected/desired behavior

The next cell on the same column should be focused.

Environment

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

It would be nice to have the possiblity to toggle edit mode on and off for the Grid.
Use case: Often users find things that need changing whilst browsing data. In those cases it would be nice to have a toggle button in the toolbar that enables and disables edit mode. n quiting edit mode the users

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>