When the kendo js references are rendered as module, the licensing banner and watermark appear, even when a valid license license key has been installed.
<link href="https://kendo.cdn.telerik.com/themes/10.2.0/default/default-ocean-blue.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.7.1.min.js" type="module"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.8.69/pdf.mjs" type="module"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.8.69/pdf.worker.mjs" type="module"></script>
<script src="https://cdn.kendostatic.com/2025.1.211/js/kendo.all.min.js" type="module"></script>
<script src="https://cdn.kendostatic.com/2025.1.211/js/kendo.aspnetmvc.min.js" type="module"></script>
No banner and watermark appears.
A banner and a watermark appears.
Workaround: reference a js file containing your script key after the kendo js files:
<script src="~/Scripts/telerik-license.js" type="module"></script>
**Kendo UI version: 2025.1.211
**Browser: [all]
Clearing the value with the Signature "clear" button does not trigger the widget's change event.
Run the following Dojo example: https://dojo.telerik.com/KhlVWvam
The change event fires.
The change event does not fire.
**Kendo UI version: 2025.1.211
**Browser: [all]
The SaveButton() method does not render the Cancel Command button in Grid's Toolbar Template
@(Html.Kendo().Grid<GridModel>()
...
.Name("grid")
.ToolBar(t =>
{
t.Template(@<text>
<span class="group-buttons">
@item.SaveButton();
</span>
</text>);
})
)
The SaveButton() method does not render the Cancel Command in Grid's Toolbar Template.
The SaveButton() method should render the Cancel Command in Grid's Toolbar Template.
A possible way to circumvent this behavior would be to explicitly declare both the Save and Cancel buttons as independent Button components via the Toolbar.ClientTemplate() API configuration.
@(Html.Kendo().Grid<GridModel>()
...
.Name("grid")
.ToolBar(t =>
{
t.ClientTemplate(Html.Kendo().Template()
.AddHtml(@<text>
<span class="group-buttons">
</text>)
.AddComponent(saveBtn => saveBtn
.Button()
.Name("saveBtn")
.Icon("check")
.HtmlAttributes(new { @class = "k-grid-save-changes", style="margin-right: 2%;" })
.Content("Save Changes")
)
.AddComponent(cancelBtn => cancelBtn
.Button()
.Icon("cancel")
.Name("cancelBtn")
.HtmlAttributes(new { @class = "k-grid-cancel-changes" })
.Content("Cancel Changes")
)
.AddHtml("</span>")
);
})
)
Describe the bug
Setting the Sortable "cursor" option results in inline styles being applied through the _setCursor function in kendo.all.min.js. This causes a CSP related js exception.
To reproduce
<ul id="sortable">
<li>ItemA1</li>
<li>ItemA2</li>
<li>ItemA3</li>
</ul>
<script>
$("#sortable").kendoSortable({
cursor: "move"
});
</script>
Expected behavior
No inline styles should be added, to ensure CSP compatibility.
Actual behavior
A js error related to inline styles is thrown.
Affected browsers (please remove the unneeded items)
Product Version
2024.4.1112
Describe the bug
The k-toolbar-solid class is not rendered in the Grid's toolbar. As a result, the theme background color is not applied to the toolbar.
To reproduce
Steps to reproduce the behavior:
Expected behavior
The k-toolbar-solid class should be applied to the toolbar's div element, as in the Kendo UI for jQuery Grid and the Core Grid.
The workaround is to add the class with jQuery, for example in the DataBound event of the Grid:
<script>
function onGridDataBound(e) {
$(e.sender.wrapper).find(".k-toolbar").addClass("k-toolbar-solid");
}
</script>
Affected browsers (please remove the unneeded items)
Product Version
2024.4.1112
The Scheduler is not rendered correctly when the Custom Toolbar is declared with a Template component
Open the following demo and notice that the Scheduler has not been rendered accordingly.
The Scheduler is not rendered accordingly.
The Scheduler should be rendered accordingly.
The TabStrip Item Action()
method is not loading content correctly.
@(Html.Kendo().TabStrip() .Name("tabs") .Items(strip => { strip.Add().Text("Back").Action("About", "Home"); // ...
For kendo.version '2024.3.806', when the tab is clicked, the controller method does not load from the Action().
For previous versions, like '2023.2.718', when the tab is clicked, the URL from the action method is loaded into the browser URL.
There is a difference in behavior between the wrappers (MVC and Core) and the Kendo UI for jQuery DateRangePicker. See the following dojo example, which shows initializing the component with a null value for the End date: https://dojo.telerik.com/IkAMUJoG/2
In contrast, the MVC and Core helpers display the Start value as End value.
The End value is the same as the Start value.
The End value is null.
Consider also the scenario, where the Range configuration is not set and the component gets the Start and End values from the model, and the value of the EndDate field is null:
@(Html.Kendo().DateRangePickerFor(m => m.StartDate, m => m.EndDate )
.Name("dateRangePicker")
)
### Bug report
When the Grid is set up for InCell editing, and the column editor is the Upload widget, the user cannot select a file to upload when the Grid is navigatable.
The issue occurs in version >= 2024.1.130
### Reproduction of the problem
1. Create an InCell editable Grid and enable its "navigatable" option.
2. Set the Upload widget as a column editor.
3. Enter a specified cell in edit mode and try to select a file for upload.
4. The cell closes immediately.
A Dojo sample for reproduction: https://dojo.telerik.com/oDaNaLiQ
### Expected/desired behavior
The cell must remain focused when the Upload button is clicked.
### Workaround
Handle the "edit" event of the Grid, handle the "mousedown" event of the Upload button, and call stopImmediatePropagation():
$("#grid").kendoGrid({
editable: true,
navigatable: true,
edit: function(e) {
if($(e.container).find("input[type='file']")) {
$(".k-upload-button").on("mousedown", function (event) {
event.stopImmediatePropagation();
});
}
}
...
});
### Environment
* **Kendo UI version: 2024.1.130
* **jQuery version: 3.7.0
* **Browser: [all]
The dropdown opens and the Editor hides.
The dropdown opens and the Editor remains open.
No dropdown is rendered.
A dropdown is rendered (see the same demo in Kendo UI for jQuery, or UI for ASP.NET Core)
Workaround - call the Grid's setOptions method on document.ready as shown below:
<script>
$(document).ready(function() {
//replace 'grid' with the actual Name value of your Grid:
$("#grid").data("kendoGrid").setOptions({
toolbar: ["paste"]
})
})
</script>
Inline Editor removes Toolbar items when it is set as resizable.
true
.The Inline Editor's Toolbar items are removed each time the ToolBar window is re-rendered.
The Inline Editor's Toolbar items should not be removed each time the ToolBar window is re-rendered.
The specific here is the disabled Sortable configuration. With Sortable enabled, the rendering on the header content is correct.
Similar issue: #6955
@(Html.Kendo().Grid<TelerikMvcApp1.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.OrderID).Filterable(false).Width(200);
columns.Bound(p => p.Freight).Width(200);
columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}").Width(200);
columns.Bound(p => p.ShipName).Width(200);
columns.Bound(p => p.ShipCity).Width(200);
})
.Pageable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
)
)
The column name is nested directly in the th element, instead of being wrapped in additional elements like in the Kendo UI for jQuery Grid or in the Grid for ASP.NET Core.
The column name should be wrapped in additional span elements with classes k-cell-inner, k-link, k-column-title:
<span class="k-cell-inner">
<span class="k-link">
<span class="k-column-title">Ship Name</span>
</span>
... anchor element...
</span>
Alternatively to step 2, click the first justify tool and then consecutively click the other 3 justify buttons.
The Editor's toolbar does not close.
The Editor toolbar closes
### Bug report
When there is an initially hidden column in the Grid with multi-column headers, the hiding/showing of columns through the ColumnMenu does not work correctly.
### Reproduction of the problem
1) Hide a column in the Grid with the Hidden(true) option.
2) Hide a column through the Grid column menu.
3) The header of the column that is hidden is added to the previous visible column.
4) Show the same column through the column menu - it does not render back as expected.
The issue is caused by the a mismatch in the column group header rendering:
<span class="k-cell-inner"><span class="k-link"><span class="k-column-title">Product Information</span></span></span>
### Environment
* **Telerik UI for ASP.NET MVC version 2024.2.514
There are multiple differences in the theme files. In the theme file added by the NuGet browser-specific styles are missing and calc values differ. Likely the issue is due to autoprefixer and postcss-calc being used in the kendo-themes repo: https://github.com/telerik/kendo-themes/blob/develop/postcss.config.js
and not being used in theme compilation logic in the kendo repo:
https://github.com/telerik/kendo/blob/production/gulpfile.js#L55C38-L55C39
https://github.com/telerik/kendo/blob/master/build/gulp/sass.js
There are multiple differences similar to the exemplary ones posted below:
Example 1:
CDN line 33994:
.k-menu-vertical > .k-menu-item > .k-menu-link > .k-menu-expand-arrow {
margin-inline-start: var(--kendo-spacing-2, 0.5rem);
margin-inline-end: calc(var(--kendo-spacing-2, 0.5rem)*2*-1 + -16px - var(--kendo-spacing-2, 0.5rem)/2*-1);
}
NuGet:
.k-menu-vertical > .k-menu-item > .k-menu-link > .k-menu-expand-arrow {
margin-inline-start: var(--kendo-spacing-2, 0.5rem);
margin-inline-end: calc( -1 * (calc( var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem)/2));
}
Note the difference in the margin-inline-end value.
Example 2:
CDN line 36510:
.k-progressbar-vertical .k-progress-status {
-ms-writing-mode: tb-lr;
writing-mode: vertical-lr;
}
NuGet:
.k-progressbar-vertical .k-progress-status {
writing-mode: vertical-lr;
}
The theme files distributed through CDN and NuGet should be identical.
Bundling the Kendo js files in an ASP.NET MVC application throws a NullReferenceException error. Reproduced with versions 2024.1.319 and 2024.2.514. The bundling works without exceptions in version 2023.3.1114.
bundles.Add(new ScriptBundle("~/bundles/kendo").Include(
"~/Scripts/kendo/2024.2.514/kendo.web.min.js",
"~/Scripts/kendo/2024.2.514/kendo.aspnetmvc.min.js"
));
Instead of kendo.web.min.js you can use kendo.all.min.js with the same result.
@Scripts.Render("~/bundles/kendo")
Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.
Workaround:
Use bundles.Add(new Bundle("~/bundles/kendo") instead of bundles.Add(new ScriptBundle("~/bundles/kendo")
No exception is thrown when bundling the Kendo script files.
### Bug report
When the Grid uses an external DataSource, the aggregates are undefined within the ClientGroupFooterTemplate().
### Reproduction of the problem
Use the following REPL sample that demonstrates the issue:
https://netcorerepl.telerik.com/mIkyQnvB382bsiFt24
1. Group the Grid by the "Freight" column.
2. An error is thrown in the browser console: "Uncaught ReferenceError: sum is not defined".
3. The aggregates=["sum"] is missing in the column options in the Grid initialization script;
"columns":[{"title":"Order ID","field":"OrderID","filterable":false,"encoded":true},{"title":"Freight","groupFooterTemplate":"Sum: #=sum#","field":"Freight","filterable":{"messages":{"title":"Show items with value that"},"checkAll":false},"encoded":true},{"title":"Ship City","width":"150px","field":"ShipCity","filterable":{"messages":{"title":"Show items with value that"},"checkAll":false},"encoded":true}]
When the DataSource is defined within the Grid configuration, the aggregate is displayed as expected.
### Expected/desired behavior
The "sum" aggregate must be displayed within the group footer template of the column when the Grid is grouped.
### Workaround
Define the DataSource in the Grid configuration or update the Grid settings by using the setOptions() method when the page is loaded:
<script>
$(document).ready(function () {
var grid = $("#grid").data("kendoGrid");
if (grid) {
let gridColumns = grid.columns;
if (!gridColumns[1].aggregates) { // update [1] with the index of the column that has a group footer template. For example, "1" is the 2nd Grid column
gridColumns[1].aggregates = ["sum"];
grid.setOptions({ columns: gridColumns });
}
}
});
</script>
### Environment
* **Telerik UI for ASP.NET Core/MVC: 2024.1.319
* **Browser: [all]
The issue is related to the specific selectors used in the filter option. The linked example contains 3 different selectors, with all of which the problematic behavior is exhibited.
The Tooltip does not hide automatically, unless you move the mouse cursor directly down from the hovered span.
The Tooltip hides automatically once you exit the boundaries of the hovered element, regardless of the cursor move direction.
When a modal Dialog is open, if we open a modal Window and then attempt to close it, a js exception is thrown. This is a regression introduced in version 2024.1.319.
Run the following dojo example: https://dojo.telerik.com/IrEWEHAZ
A js exception is thrown:
Uncaught TypeError: this._object(...)._overlay is not a function
The issue is related to the modal option being enabled in both the Dialog and the Window. Disabling this option in one of them, prevents the exception.
The Window closes without exceptions.