Dear team,
Recently I've updated the kendo UI.
currently I'm using the this version.
Here I wrote the code for testing.
// cshtml code
@(Html.Kendo().Grid<Alliant.Controllers.ProductViewModel>()
.Name("mixedSort")
.Columns(columns => {
columns.Bound(o => o.ProductName).Width(300);
columns.Bound(p => p.UnitPrice).Width(300);
columns.Bound(p => p.UnitsInStock).Width(300);
columns.Bound(p => p.Discontinued).Width(300);
columns.Bound(p => p.Group).Width(300);
})
.Pageable(pageable => pageable.ButtonCount(5))
.Sortable(sortable => sortable
.AllowUnsort(true)
.SortMode(GridSortMode.Mixed)
.ShowIndexes(true))
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("Sorting_Orders_Read", "Testing"))
)
)
// Controller code
public ActionResult Sorting_Orders_Read([DataSourceRequest] DataSourceRequest request)
{
List<ProductViewModel> lstData = new List<ProductViewModel>()
{
new ProductViewModel(){Group="A",ProductName="A1",UnitPrice=10,Discontinued=1,UnitsInStock=50},
new ProductViewModel(){Group="A",ProductName="B1",UnitPrice=20,Discontinued=2,UnitsInStock=60},
new ProductViewModel(){Group="B",ProductName="C1",UnitPrice=30,Discontinued=3,UnitsInStock=70},
new ProductViewModel(){Group="C",ProductName="D1",UnitPrice=40,Discontinued=4,UnitsInStock=80},
new ProductViewModel(){Group="C",ProductName="E1",UnitPrice=50,Discontinued=5,UnitsInStock=90},
};
return Json(lstData.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}
// Modelpublic class ProductViewModel
{
public string ProductName { get; set; }
public decimal UnitPrice { get; set; }
public int UnitsInStock { get; set; }
public decimal Discontinued { get; set; }
public string Group { get; set; }
}
Could you please help me to figure out the issue?
I also checked the jquery code.
// Jquery code render by kendo
### 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.
1. Create a solution with several Telerik UI for MVC projects
2. Perform a rename of a value that is present in multiple projects
Expected result: Rename is performed successfully.
Actual result: Visual Studio crashes.
Application: devenv.exe
Using the PDFViewer with the latest version of PDF.js (3.9.179) throws js exceptions. Version 3.4.120 is the last one, with which no js exception is thrown.
Dojo example: https://dojo.telerik.com/IHedIhur/3
The file is loaded, however, js exceptions are thrown:
The --scale-factor
CSS-variable must be set, to the same value as viewport.scale
, either on the container
-element itself or higher up in the DOM. text_layer.js:480:14
No js exceptions when using PDF.js versions newer than v3.4.120.
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.
### Bug report
The legend items cannot be configured in the SeriesDefaults() configuration of the Pie Chart.
### Reproduction of the problem
1) Create a Pie Chart with a visible legend.
2) Add the SeriesDefaults() configuration and try to add the LegendItem() option to set the type of the legend items.
.SeriesDefaults(seriesDefaults =>
{
seriesDefaults
.Pie();
.LegendItem(x => x
.Type("line")
.Line(y => y.DashType(ChartDashType.Solid)));
})
The Legenditem() option is available for Telerik UI for ASP.NET Core Pie Chart.
### Expected/desired behavior
The legend items of the Pie Chart must be configurable through the SeriesDefaults() option.
### Environment
* **Telerik UI for ASP.NET MVC version: 2024.1.319
* **Browser: [all]
<div id="pdfViewer">
</div>
<script type="text/javascript">
$("#pdfViewer").kendoPDFViewer({
pdfjsProcessing: {
file: ""
}
});
function loadFile() {
$("#pdfViewer").data("kendoPDFViewer").fromFile("@Url.Action("GetPDF", "Home")");
}
</script>
public ActionResult GetPDF()
{
var name = "sample.pdf";
string path = Server.MapPath("/Content/pdf/sample.pdf");
//generate a random boolean:
Random rng = new Random();
bool randomBool = rng.Next(0, 2) > 0;
if (randomBool)
{
byte[] fileBytes = System.IO.File.ReadAllBytes(path);
return File(fileBytes, System.Net.Mime.MediaTypeNames.Application.Octet, name);
}
else
{
return new HttpNotFoundResult("File not found.");
}
}
In the case where the request returns HttpNotFoundResult, a number of js errors are thrown:
util.js:417 Uncaught (in promise)
The user loses the ability to load a file, because subsequent attempts to load a file by clicking the button result in another js exception:
api.js:1114 Uncaught TypeError: Cannot read properties of null (reading 'sendWithStream')
The component should show a message that a file is not found, without throwing js exceptions and should not become unusable after a failed attempt to load a file.
A hidden template column that is not included in the ColumnMenu appears after showing another column
.Columns(columns =>
{
//Hidden template column
columns.Template(x =>
{
int rptIndex = Model.IndexOf(x);
string namePrefix = "Grid[" + rptIndex + "].";
Html.Hidden(namePrefix + "Id", x.Id, new { @readonly = "readonly" });
Html.Hidden(namePrefix + "Name", x.Name, new { @readonly = "readonly" });
}).Hidden().IncludeInMenu(false);
columns.Bound(x => x.Id).Width(120).Hidden(true);
columns.Bound(x => x.Name).Width(200);
columns.Bound(x => x.ReportingDateOriginal).Width(500).HtmlAttributes(new { id = "reporting-date-original" })
.Filterable(f => f.UI(GridFilterUIRole.DateTimePicker).Cell(c => c.Template("dateFilter")));
columns.Bound(x => x.Test1).Width(200).Hidden(true);
columns.Bound(x => x.TimezoneOffset).Width(200).HtmlAttributes(new { id = "reporting-date-offset" });
columns.Bound(x => x.Test2).Width(200).Hidden(true);
columns.Bound(x => x.ReportingDateAdjusted).Width(500).HtmlAttributes(new { id = "reporting-date-adjusted" })
.Filterable(f => f.UI(GridFilterUIRole.DateTimePicker).Cell(c => c.Template("dateFilter")));
columns.Bound(x => x.Test3).Width(200);
columns.Bound(x => x.Test4).Width(200).Hidden(true);
columns.Bound(x => x.Test5).Width(200);
})
The first time instead of the Id, the template column appears.
The Id column should appear and the template column should remain hidden.
I have a cshtml page that uses Kendo UI ASP.NET MVC that does the following:
The view contains one or more grid widgets (the number depends on how many result types were requested) and each grid is set up to export Excel.
The problem is that when window.open() is used to open a new tab, the browser history state is null and the window.location.href is empty with the browser location showing "about:blank". For Chrome and Firefox, this does not cause any issues when exporting excel for the grid. However, when using Edge with this situation, when the Export to Excel grid toolbar button is clicked and the onExportExcel event is fired, the browser Open or Save dialog prompt is displayed but the active tab (the one that contained the grid) closes. This behaviour is very undesireable. The ProxyUrl grid excel option does not fire since Edge supports javascript file saving.
A workaround for this situation is to forcibly set the new tab window object location href by using the window.history.pushUpdate function. A code snippet is included below.
let dataModel = {Id = 123571113, Name="jason bourne"}; let jsonModel = JSON.stringify(dataModel); let curDate = new Date(); let targetUrl = '@Url.Action("Reports", "Report", new { @area = "Reports" })'; let targetWindowName = "something meaningful" + " " + curDate.toISOString();//add datetime stamp to avoid issue where you cannot open a window with the same name as the current window. let html = "some html content to provide a temporary message to your audience"; let targetWindow = window.open(targetUrl, targetWindowName); if (targetWindow !== null && targetWindow !== undefined) { targetWindow.document.write(html); targetWindow.document.close(); // to finish loading the page targetWindow.document.title = targetWindowName; //attempt to forcibly update the URL in the history and target window location to fix problem with grid export to excel on Edge browser let targetWindowHistoryHref = window.location.href; if (oModel.BuildingDesigns !== null && oModel.BuildingDesigns !== undefined && oModel.BuildingDesigns.length > 0) { targetWindowHistoryHref += "?oBuildingDesignId=" + oModel.BuildingDesigns[0].ObfuscatedBuildingDesignId + "&BuildingDesignName=" + oModel.BuildingDesigns[0].BuildingDesignName; } else { targetWindowHistoryHref += "?" + oModel.Target; } targetWindow.history.pushState(null, null, targetWindowHistoryHref); } $.when( $.ajax({ type: "POST", dataType: "html", // this is the data type expected to be returned from the controller method contentType: "application/json", // this is the content type expected by the controller method url: targetUrl, data: jsonModel, beforeSend: function() { console.log(".... submitting report request"); athena.loader.loading("submitting report request"); }, success: function(response) { athena.loader.stopLoading(); if (debugLevel > 2) { console.log(".... response = " + response + " : ", response); } //attempt to populate the target browser tab with the response try { console.log(".... attempting to open a browser tab and populate it with the HTML response object"); console.log(".... targetWindow = " + targetWindow); //will trigger popup blockers :: targetWindow = window.open("", oModel.Target); if (targetWindow !== null) { if (response === null || response === undefined) { targetWindow.document.body.innerHTML = ''; } else { //completely replace the existing document (not just the innerhtml) targetWindow.document.open(); targetWindow.document.write(response); targetWindow.document.close(); targetWindow.document.title = targetWindowName; } } } catch (ex) { // do nothing, just catch when the open fails. console.log("error: " + ex.message); } }, error: function(jqXhr, textStatus, errorThrown) { console.log('.... error :: ajax status = ' + textStatus + ' :: errorThrown = ' + errorThrown); console.log('....-- jqXhr.responseText :: \n' + jqXhr.responseText); } }) ).done( function() { console.log(".... report request has completed"); targetWindow.focus(); } );
Related: telerik/kendo#18503
Dojo example: https://dojo.telerik.com/AWiYAlIm/5
A js exception is thrown:
e.popup.fullscreen is not a function
No exceptions are thrown.
Reproducible with a Grid nested in the content of the tab, or loaded in the tab through AJAX.
Dojo example: https://dojo.telerik.com/eJuHaTan
The rows cannot be reordered.
The rows can be reordered.
When importing a XLSX file with a frozen pane using server implementation(using the Document Processing Library), the dimensions of the frozen pane are missed.
The imported xlsx file appears to overflow the Kendo UI Spreadsheet component. See screencast(SpreadhsheetOverflowFrozenPane.zip)
When importing a file using server implementation, the file should be contained within the Kendo UI Spreadsheet component's view.
Reduce the amount of frozen rows/columns to fit into the widget.
Reproducible in MVC with a custom toolbar tool that has a ClientTemplate.
@(Html.Kendo().Grid<TelerikMvcApp2.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);
})
.ToolBar(toolbar =>
{
toolbar.Save();
toolbar.Spacer();
toolbar.Custom().ClientTemplate("<span>test</span>");
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.Editable(editable => editable.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(model => model.Id(p => p.OrderID))
.Read(read => read.Action("Orders_Read", "Grid"))
.Create("Orders_Create", "Grid")
.Update("Orders_Update", "Grid")
)
)
Duplication of the "Cancel" button.
A single "Cancel" button is rendered in the toolbar.
<div id="grid"></div>
<script>
// The dataSource is initialized as a stand-alone widget that can be bound to the Grid.
var dataSource = new kendo.data.DataSource({
transport: {
read: {
// The remote endpoint from which the data is retrieved.
url: "https://demos.telerik.com/kendo-ui/service/products",
dataType: "jsonp"
}
},
pageSize: 10
});
$("#grid").kendoGrid({
// The dataSource configuration is set to an existing DataSource instance.
dataSource: dataSource,
pageable: true
});
</script>
The breakpoint is added at the last line (326079) of the file.
The breakpoint is added at the desired line (e.g., 3715).
Dragging a row from a Grid to another empty Grid is not working.
The row is not inserted in the empty Grid
The row should be inserted in the empty Grid.
Open a Signature Component demo and try to draw/sign fast on an Android device.
When signing fast on an Android device on the Signature component, making a signature from multiple parts by picking up the finger several times, the signature process freezes for a small period of time.
See attached videos where we tested on Android and IOS devices:
Signing/drawing should be smooth