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
- Open the Dojo - https://dojo.telerik.com/@NeliK/AGATEWAR
- 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
- Open this Dojo example - https://dojo.telerik.com/AsaNeqOc
- 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
- Open this demo - https://demos.telerik.com/kendo-ui/grid/column-menu
- 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
It will toggle the mode and display the Filter clear button outside of the autocomplete edit box but will not clear the filter.
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]
Bug report
Grid throws error when partial update is executed and selection is persisted
Reproduction of the problem
- Open the following dojo.
- Select a row.
- Place it into edit mode.
- Make some changes and click on the
Savecommand button. - 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
- Open the Dojo - https://dojo.telerik.com/@NeliK/AzirANuT
- Try to select the text in the
Francecell 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:
- https://dojo.telerik.com/URaJeSEk
- 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.
It would be nice to have the progress when exporting the grid to excel so that the user knows that something is happening.
Hi Team,
I would like to request that the Kendo UI Grid includes an event for when an export is completed. This way, I can control and alert the user when a document has been successfully exported.
Thank you!
Describe the bug
With LESS themes on iOS devices when the user taps and holds an icon in the Grid the following system popup appears
With the SASS themes the popup is not displayed.
To reproduce
- Open the Dojo on an iOS device - https://dojo.telerik.com/@NeliK/oSODAvAz
- Tap and hold one of the images
Expected behavior
The popup for saving/copying the image should be displayed.
The same example using LESS themes - https://dojo.telerik.com/IsOvIjef
The issue might be due to the usage of -webkit-touch-callout
Workaround
<style>
.k-grid{
-webkit-touch-callout: unset !important;
}
</style>Affected package
- theme-default
- theme-bootstrap
- theme-material
- theme-tasks
Affected suites
- Kendo UI for jQuery
Affected browsers
- All
Build system information
- OS: [iOS]
When we have a Grid with Resizable Columns we may need some of them to be non-resizable (ex. a column containing only status icons). There are work around and customizations: Column Resize - Min Width on Resize http://www.telerik.com/forums/column-resize---min-width-on-resize but I believe it will be more handy to define requested behavior as a property of the specific column (ex. in row template). Also, for non resizable columns the user should not even take a resize handle when going on a non resizable column boundary instead of try to resize and when the user leaves the resize handle the column is bouncing back (restoring) the minimum width defined. Regards, Thomas
Currently you can clone the Pager to make it appear both on Top/Bottom. This should be configurable so that you can have in on top of the grid or the bottom of grid or both
Deleting last remaining row on kendo grid on the last page does not go to the previous page. When using client side filtering, deleting the last remaining record should change the current page of grid to previous page.
Bug report
Get a scenario where we have a Grid with the following configs:
- There is a selectable column in the Grid
- There are one or more locked columns
- The reorderable.row value to true
Having the above configuration, try to reorder random rows. The value in the Drag Hint shows a number of files that is twice the number of the selected for reordering rows.
- Note: In a scenario with a selectable column to be able to reorder rows, we have to select these rows at first
Reproduction of the problem
- Open this Dojo example
- Select two random rows in the Grid by checking their checkboxes
- Use the Contact Title column to start the row dragging(We need this column because the rows' reorder cannot start from a locked column)
Current behavior
The text inside the Drag Hint is "4 items selected"
Expected/desired behavior
The text inside the Drag Hint should correspond to the number of the selected rows. In the above scenario, the text should be "2 items selected"
Environment
- Kendo UI version: 2022.2.802
- jQuery version: x.y
- Browser: [all]
Bug report
In a Grid with a hidden column, the aggregates in the footer shift to the right if you edit a cell.
Regression introduced with 2023.2.829
Reproduction of the problem
- Open this Dojo example - https://dojo.telerik.com/EXOmOcAs
- Scroll to the bottom to see the footer
- Edit a cell
Current behavior
The footer cells shift to the right.
Expected/desired behavior
The footer cells shouldn't shift to the right after updating a cell.
Environment
- Kendo UI version: 2024.1.130
- Browser: [all]