Bug report

Regression introduced in R3 2023 SP1
If an initially hidden column is shown with the showColumn API method, the column header remains hidden because of the k-hidden class that remains in the th element.

Reproduction of the problem

1. Click on the button above the Grid in the example below

<input type="button" name="btn1" value="Show the hidden columns" onclick="btn1Click()" />
<br />
<br />

@(Html.Kendo().Grid<TelerikMvcApp1.Models.OrderViewModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.OrderID);
        columns.Bound(p => p.Freight);
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity).Hidden(true);
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}").Hidden(true);
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Orders_Read", "Grid"))
    )
)

<script>
    function btn1Click() {
        var grid = $("#Grid").data("kendoGrid");

        grid.showColumn("ShipCity");
        grid.showColumn("OrderDate");
    }
</script>

Current behavior

The hidden columns are shown but their headers remain hidden.

As a workaround, the k-hidden class can be removed from the column header, after showing the column:

grid.showColumn("ShipCity");
$(".k-grid .k-header[data-field='ShipCity']").removeClass("k-hidden");

Expected/desired behavior

The columns and their headers are shown.

Environment

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

Bug report

The ClientGroupFooterTemplate and ClientFooterTemplate configuration lead to an invalid template error when strict CSP mode is enabled. There are no corresponding methods that accept a TemplateHandler.

Reproduction of the problem

@(Html.Kendo().Grid<TelerikMvcApp3.Models.OrderViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.OrderID).Filterable(false);
        columns.Bound(p => p.Freight);
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity).ClientGroupFooterTemplate("Total:").ClientFooterTemplate("Team Total");
    })
    .Groupable()
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:550px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Orders_Read", "Home"))
    )
)


@(Html.Kendo().DeferredScriptFile())

Current behavior

JS exceptions on initializing the Grid and on attempting to group it by ShipCity.

Expected/desired behavior

CSP compatible templates.

Environment

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

Bug report

Reproduction of the problem

1. Compare the rendering of the "Next Page", "Last Page", "Previous Page" and "First Page" buttons in RTL between the MVC Grid and the jQuery and Core Grids:

https://demos.telerik.com/aspnet-mvc/grid/right-to-left-support
https://demos.telerik.com/kendo-ui/grid/right-to-left-support
https://demos.telerik.com/aspnet-core/grid/right-to-left-support

Current behavior

Incorrect rendering of the buttons.

Expected/desired behavior

Buttons rendered consistently with the jQuery and Core Grids.

Environment

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

Bug report

Reproducible with a Grid nested in the content of the tab, or loaded in the tab through AJAX.

Reproduction of the problem

Dojo example: https://dojo.telerik.com/eJuHaTan

1. Select Tab1, or click the button above the TabStrip to select the tab programmatically.
2. Try to reorder a row in the Grid in Tab1.

Current behavior

The rows cannot be reordered.

Expected/desired behavior

The rows can be reordered.

Environment

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

Bug report

Prerequisites: reordering a non-locked column before a locked column. There could be one or more locked columns.
This behavior appeared in v2021.3.1207.

Reproduction of the problem

Dojo example: https://dojo.telerik.com/UhExAXIv/5

1. Click, hold and slowly drag the header of the OrderDate column over the locked ID column.
2. Attempt to reorder the OrderDate column before the ID column.

Current behavior

The reorder hint appears only when you hover the left border of the ID cell. This makes dropping the header at the right spot difficult, since you have to be very precise and if you are too fast, you have to re-adjust the mouse cursor position right on top of the left border of the cell.

Expected/desired behavior

The reorder hint should appear when mouse cursor enters the boundaries of the target cell. For example, slowly drag ShipCity before ShipCountry. Note how the reorder hint appears once you enter the boundaries of the ShipCountry cell and you don't have to drag all the way to ShipCountry's left border.

Environment

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

Bug report

The Kendo UI Grid's Toolbar Template UI for ASP.NET MVC documentation displays an approach used for UI for ASP.NET Core. The ClientTemplate and ClientTemplateID are not available for UI for ASP.NET MVC.

Reproduction of the problem

Please try the approach used in the documentation. It is not available for UI for ASP.NET MVC.

Expected/desired behavior

Either include the approach for UI for ASP.NET MVC, or modify the documentation.

Environment

• Kendo UI version: 2022.2.510
• jQuery version: 3.6
• Browser: all

Bug report

When a UI for ASP.NET MVC Grid contains a PDF or Excel button within the Toolbar, the IconClass is being ignored.

Reproduction of the problem

.ToolBar(t => t.Excel().Text("Export to Excel").IconClass("icon here"))

Current behavior

Expected/desired behavior

The specific icon should be added based on the IconClass.

Environment

• Kendo UI version: 2023.2.606
• jQuery version: All Supported Versions
• Browser: All

Bug report

Reproduction of the problem

Have a Grid bound to local data (see below code snippets and screenshot)

@model Pager_issue.Models.GridViewModel

@(Html.Kendo().Grid(Model.Items)
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.OrderID).Filterable(false);
        columns.Bound(p => p.Freight);
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity);
    })
    .Pageable(p => p.PageSizes(new[] { "5", "10", "50", "all" }).PreviousNext(false))
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:550px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
    )
)

    public class HomeController : Controller
    {
        [HttpGet]
        public ActionResult Index()
        {
            var model = new GridViewModel
            {
                Items = Enumerable.Range(0, 200).Select(i => new OrderViewModel
                {
                    OrderID = i,
                    Freight = i * 10,
                    OrderDate = DateTime.Now.AddDays(i),
                    ShipName = "ShipName " + i,
                    ShipCity = "ShipCity " + i
                })
            };

            return View(model);
        }

Current behavior

When filling the Grid with data via a ViewModel, the pager doesn't show on load

Expected/desired behavior

The pager should be visible on load

Environment

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

I use getOptions() and setOptions() to persist the state of the ajax bound grid that I have.

My toolbar is not a server one, it is this:

.ToolBar(toolbar =>toolbar.Create().HtmlAttributes(new { @class ="k-primary"}))

When I call the setOptions() method, it removes the Add button from the grid header.

Bug report

Not reproducible with the UI for ASP.NET Core Grid helper.

Reproduction of the problem

1. Set the Total option of the DataSource in a Grid:

.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(15)
    .Read(read => read.Action("Orders_Read", "Grid"))
    .Total(50)
)

2. Compare the rendering of the pager "next page" and "last page" buttons with the Total option set and without it.

Current behavior

The "next page" and "last page" buttons in the Grid's pager are rendered as anchor Html elements, when Total is set in the DataSource. When it is not set, the buttons are rendered as button Html elements.

Expected/desired behavior

The rendering of the pager buttons should be consistent and they should render as button Html elements.

Environment

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

Hello telerik support,

recently we updated to 2023.2.718

somehow the grid column menu is not completely in german language 

How can I apply german language to the complete column menu?

Best regards

Andy

Add a class to cells in a sorted column (similarly to the .k-sorted class in a sorted column's <th> element) to distinguish them from cells in unsorted columns.

Bug report

When the Grid is set initially with a sort operation, the icon for the column will show twice in a UI for ASP.NET MVC web application.

Reproduction of the problem

Using the Kendo UI Grid template, add the sorting configuration to the dataSource:

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()    
    .Name("grid")
    .Columns(columns => {
        columns.Bound(p => p.OrderID).Filterable(false).Width(200);
        columns.Bound(p => p.Freight).Width(100);
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}").Width(140);
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity).Width(150);
    })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Orders_Read", "Grid"))
        .Sort(s => s.Add("OrderID").Descending()))  //Added Predefined Sort
)

Current behavior

Expected/desired behavior

The icon should only appear once for the sorted column.

Environment

• Kendo UI version: 2023.1.425
• jQuery version: All Supported Versions
• Browser: all

### Bug report

The Grid columns do not expose the ClientTemplateHandler() method. It is available in Telerik UI for ASP.NET Core since version 2023.1.314.

### Reproduction of the problem

columns.Bound(p => p.IsAlwaysIncluded).ClientTemplateHandler("myColTemplate");

<script>
function myColTemplate(data) {
  return `<div>${data.IsAlwaysIncluded}</div>`
}
</script>

The ClientTemplateHandler() method must be exposed for the Grid columns.

### Environment

Telerik UI for ASP.NET MVC version: 2023.1.425
* **Browser: [all]

Bug report

The attributes handler overload does not get executed when the column is initially marked as hidden.

Reproduction of the problem

1. Open the following dojo.
2. Change the hidden property of the ContactTitle field to true.

Current behavior

The attributes handler is not executed when the column is hidden.

Expected/desired behavior

The attributes handler should be executed when the column is hidden.

Environment

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

Bug report

Regression in R1 2023 SP1.

Reproduction of the problem

Set a HeaderTemplate in one of the following 3 ways.

columns.Bound(p => p.Freight).HeaderTemplate("<div title='Freight'>Freight</div>");

columns.Bound(p => p.Freight).HeaderTemplate(@<text>
<div title="Freight">Freight</div>
</text>);

columns.Bound(p => p.Freight).HeaderTemplate(@<div title="Freight">Freight</div>);

Current behavior

In the first scenario the error is:
System.NotSupportedException: Specified method is not supported. 

In the second and third scenario the error is:
Index was out of range. Must be non-negative and less than the size of the collection.
Parameter name: index

Expected/desired behavior

No exception thrown when the HeaderTemplate is set.

Environment

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

Bug report

Reproduction of the problem

https://demos.telerik.com/aspnet-mvc/grid/persist-state

1. Add a search panel to the Grid: .ToolBar(t => t.Search())
2. Save its state and then load the saved state

Current behavior

The search panel disappears from the Grid's toolbar.

Expected/desired behavior

The search panel is present in the Grid's toolbar.

Environment

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