Kendoui Grid filterin is excellent. But we can not use filter ui without grid. Kendoui has pager plugin so we can use pager plugin with datasource also without grid. But there is no filter plugin using filterin ui without grid. I put a screenshoot from another web app which show what i mean.

Disclaimer: I'm running an older version of Kendo UI for jQuery, so this may have been fixed. I'd like confirmation if so before updating.

Kendo version: 2017.1.118.545

I am creating a grid from a table data source rather than an endpoint call. Other pages that use endpoints to populate the datasource export Excel with no problems.

Example HTML:

<table class="table table-responsive" id="tblReportSummary">
<colgroup>
<col />
<col />
<col />
<col />
<col />
</colgroup>
<thead>
<tr>
<th data-field="date">Date</th>
<th data-field="totalForStatus">Count</th>
</tr>
</thead>
<tbody>
@foreach (var item in ViewBag.ReportDataSummary as IEnumerable<UtilizationListViewModel>)
{
<tr>
<td>@item.Date</td>
<td>@item.TotalForStatus</td>
</tr>
}
</tbody>
</table>

The jQuery is as follows:

             $("#tblReportSummary").kendoGrid({
                sortable: true,
                toolbar: ["excel"],
                excel: {
                    allPages: true,
                    fileName: "Utilization Data Export.xlsx"
                },
                pageable: {
                    pageSize: 20,
                    pageSizes: [20, 50, 100]
                }
            });

When I click Export, all I get is an empty Excel file.

Why isn't the data there, please?

When there are a lot of columns on the page and a column is shown, it is shown at its original position in the grid columns array. 

It would be much better from a user experience point of view if the column is shown where the user clicked on the column menu to show the hidden column.

### Bug report

When the adaptive rendering of the Kendo UI Grid is enabled, the filterMenuOpen event is not triggered.

### Reproduction of the problem

1. Set mobile: true.

2. Attach the filterMenuOpen.

Dojo sample for reproduction:

https://dojo.telerik.com/uhiToseD

### Expected/desired behavior

filterMenuInit event should be triggered regardless of the adaptive rendering mode of the grid.

### Environment

* **Kendo UI version:** 2020.1.219
* **jQuery version:** 1.12.4
* **Browser:** [all] 

Reproduction of the problem

1. In the SASS Theme builder, create а theme based on the Default theme
2. Download it and load it on a page with a Grid

Current behavior

On desktop there is a page number duplication: screenshot.
On mobile the page numbers disappear: screenshot

Expected/desired behavior

The pager should look like in the Default theme.

Hi Team,

I'd like to request the functionality to allow the user to select the ALL option while using GroupPaging.  

Thank you

The pager drop down page selector is too large and obscures other controls and the bottom of the pager frame.

I hope this observation is useful.

I have a screenshot but there is no facility here to post it.

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

When multicolumn headers are configured in the Grid and exportSelectedToExcel method is used for exporting, a file is not always generated. The issue is reproducible when selectable is set to selectable: "multiple, cell" and cell from the first column of the multicolumn header is selected.

Reproduction of the problem

1, Open the Dojo
2. Select a single cell from the 'field1' column
3. Click the 'Export selected' button

Current behavior

No file is generated. If for example also a cell from another column is selected, then the Excel file is generated as expected

Expected/desired behavior

An Excel file should be generated as expected even if only a single cell is selected.

Environment

• Kendo UI version: 2021.2.616
• jQuery version: x.y
• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

Bug report

The Grid column header texts collides with the columnMenu icons.

Regression introduced with 2023.1.314

Reproduction of the problem

1. Open this Dojo example or the Multi-Checkboxes Grid demo (on a small screen)

Current behavior

The column header text overlaps with the menu icon

Expected/desired behavior

the header text shouldn't collide with the menu icon

Environment

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

Bug report

Clicking on a custom icon-button command in the Grid fires a change event.
This is a regression introduced with v 2023.2.606

Reproduction of the problem

1. Run this dojo
2. Click on the custom command button - only the click handler is executed
3. Click on the icon button - a change event is fired and the click handler is executed

Expected/desired behavior

Only the click handler should be executed on click of an icon button representing a custom command.

Environment

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

Bug report

When tabbing through the row filter inputs of a virtual Grid only headers are scrolling

Reproduction of the problem

Run this Dojo - https://dojo.telerik.com/IjuJoRAx/5

Expected/desired behavior

Headers and columns shall scroll when tabbing through the row filter inputs

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

Hi

again this request is not urgent as I implemented this myself.
I'd like to have 'nextRecord' 'previousRecord' functionality in the grid widget.

We have a next/previous record button on our forms and as floating buttons to navigate the records.
As soon as we navigate to the next/previous record, the form loads the data of the concerning record.

My current implementation is as follows:

/**
 *
 * Grid with navigation code included 
 * 
 * selectRowByIndex: 0 based row selection by index of currently shown rows
 *
 * @author Alex Bernhard <alex.bernhard@uzh.ch>
 * @version 1.2.0
 */


(function ($) {

    var kendo = window.kendo,
        ui = kendo.ui,
        Grid = ui.Grid,
        self = this;

    var NavigatableGrid = Grid.extend({
        init: function (element, options) {

            // assign that to this
            var self = this;
            this.selectedIndex = 0;
            this.updateAfterLoad = false;

            // call the base function to create the widget
            Grid.fn.init.call(this, element, options);

            if (typeof options['updateMethod'] == 'function') {
                this.updateMethod = options['updateMethod'];
            }

            self.bindEvents();

        },
        options: {
            name: "NavigatableGrid",
        },
        bindEvents: function () {
            this.bind("change", function () { this.setSelectedIndex(); });
            this.bind("dataBound", function () {
                this.selectRowByIndex(this.selectedIndex);
                // after selecting the next row, shall update be called here?
                // happens only when navigating to a new page
                // or after search results are present
                if (this.updateAfterLoad) {
                    this.updateAfterLoad = false;
                    let selectedItem = this.dataItem(this.select());
                    if(selectedItem != null && selectedItem.hasOwnProperty('id')){
                        this.updateMethod(selectedItem.id);
                    }
                }              

                return false;
            });
        },
        updateMethod: function () { },        
        setSelectedIndex: function () {
            let dataRows = this.items();
            this.selectedIndex = dataRows.index(this.select());
            return this.selectedIndex;
        },
        selectRowByIndex: function (index) {
            // zero based index
            this.clearSelection();
            this.select('tr:eq(' + index + ')');
        },
        selectRowById: function (id) {
            this.clearSelection();
            let view = this.dataSource.view();
            let _self = this;
            let rows = $.grep(view, function (item) {
                return item.id == id;
            }).map(function (item) {
                return _self.tbody.find("[data-uid=" + item.uid + "]");
            });

            if (Array.isArray(rows) && typeof rows[0] !== 'undefined') {
                this.select(rows[0]);
            }
        },
        previousRow: function () {

            // get current number of rows
            let pageSize = this.dataSource.pageSize();
            let currentPage = this.dataSource.page();

            // already first row of current page ?
            if (this.selectedIndex == 0) {
                let previousPage = currentPage - 1;
                // not the first page yet - load the previous page and read the data
                // after load
                if (previousPage > 0) {
                    this.selectedIndex = pageSize - 1; // last row of previous page
                    this.updateAfterLoad = true;
                    this.dataSource.page(previousPage);
                }
            } else {
                // set next row index (0 based !!)
                this.selectedIndex = Math.max(this.selectedIndex - 1, 0);
                this.selectRowByIndex(this.selectedIndex);
                this.updateAfterLoad = false;

                let selectedItem = this.dataItem(this.select());   
                if(selectedItem != null && selectedItem.hasOwnProperty('id')){
                    this.updateMethod(selectedItem.id);
                }
            }
        },
        nextRow: function () {

            // get current number of rows
            let numRows = this.items().length;
            let pageSize = this.dataSource.pageSize();
            let numPages = this.dataSource.totalPages();
            let currentPage = this.dataSource.page();

            // already last row of current page ?
            if (this.selectedIndex == numRows -1) {
                let nextPage = currentPage + 1;
                // not the last page yet - load the next page and read the data
                // after load
                if (nextPage <= numPages) {
                    this.dataSource.page(nextPage);
                    this.selectedIndex = 0;
                    this.updateAfterLoad = true;
                }
            } else {
                // set next row index (zero based !!)
                this.selectedIndex = Math.min(this.selectedIndex + 1, pageSize-1);
                this.selectRowByIndex(this.selectedIndex);
                
                let selectedItem = this.dataItem(this.select());   
                if(selectedItem != null && selectedItem.hasOwnProperty('id')){
                    this.updateMethod(selectedItem.id);
                }
            }
        }
    });
    kendo.ui.plugin(NavigatableGrid);
})(jQuery);

And an example usage is like:

accessionGrid = $("#accession-grid").kendoNavigatableGrid({
.... standard code for kendo grid
// call method in form when navigating
 updateMethod: function(data){accessionForm.update(data)},
.....
});

// code for grid navigation
function nextAccessionGridRow(){
    accessionGrid.nextRow();
}

function previousAccessionGridRow(){
    accessionGrid.previousRow();
}

Allow using kendo templates in columns.attributes for example

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [ {
    field: "name",
    title: "Name",
    attributes: {
      "data-id": "#:data.id#",
      "data-clientid": "#:data.clientId#",
    }
  } ],
  dataSource: [ { id:1, name: "Jane Doe", clientId:"#223" }, { id:2, name: "John Doe", clientId:"#354"  }]
});
</script>

https://demos.telerik.com/kendo-ui/grid/server-grouppaging-virtualization and click to Edit in Dojo. It o

pens https://dojo.telerik.com/afoCefOJ

group: [{
                        field: "city",
                        dir: "asc"
                    }, {
                        field: "companyName",
                        dir: "asc"
                    }],

group: [{
                        field: "city",
                        dir: "asc"
                    }],

and also adjust pageSize to 10:

pageSize: 10,

Bug report

In the draggable Grid, after new items are created the dragging of the rows does not work as expected.

Reproduction of the problem

1. Open the Dojo example - https://dojo.telerik.com/@NeliKondova/USiBUBex
2. Add multiple items - lets say 4,5,6
3. Try to drag the rows to reorder them.

Current behavior

Sometimes the rows can not be moved at all, sometimes it is dropped in the wrong place.

Expected/desired behavior

The rows should be dragged and dropped without any issue even after creating new items in the Grid.

Environment

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

Bug report

When PivotConfiguratorV2 and Grid are configured on the same page and sortable and/or filterable are enabled for both components an error is thrown in the console when trying to filter.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliKondova/utiHOPIc
2. Click to filter the data in the Grid using the column menu

Current behavior

The following error is thrown in the console:
Uncaught TypeError: Cannot read properties of undefined (reading 'close')

Expected/desired behavior

There should be no error in the console and it should be possible for both PivotConfiguratorV2 and Grid to be sortable and filterable.

Environment

• Kendo UI version: 2023.2.718
• 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]