kendo-grid 相关问题

Kendo Grid是一个Kendo小部件,可显示表格数据并提供与数据交互的丰富支持,包括分页,排序,分组和选择。 Grid是一个功能强大的widget,有许多配置选项。它可以使用Kendo DataSource组件绑定到本地JSON数据或远程数据。

使用 asp.net MVC 包装器在 Kendo UI 网格中格式化日期时间

我想构建一个格式为日期 dd//MM/yyyy 的 Kendo UI 网格。但是,我发现的所有与此相关的问题都通过代码 Format("{0:d}"); 解决了。所以,我尝试过像下面的代码:

回答 9 投票 0

启用垂直滚动时,Kendo 网格标题未对齐

我在我的剑道网格上注意到这一点已经有一段时间了。我在 SO 或 Telerik 支持论坛上找不到任何关于它的信息,所以我想我只想看看是否有其他人有这个...

回答 3 投票 0

Angular 10 Kendo Grid 导致“没有‘new’就无法调用类构造函数 vA”错误

我正在尝试在 Angular 应用程序中实现 Kendo Grid,但在启用 Kendo Grid 组件时遇到以下错误: vendor.4add67dadae0cd9152b9.js:16 错误错误:Unc...

回答 1 投票 0

kendo grid setOptions - 如何处理网格模式的重大更改?

我有一个 ASP.NET MVC Kendo Grid,可以保存列顺序和可见性,类似于此示例 网格选项持久保存到数据库中。现有选项引用特定列...

回答 1 投票 0

Kendo Grid:使用 rowReorderable 时自定义拖动提示

使用 rowReorderable 时是否可以自定义剑道网格上的行拖动提示?

回答 1 投票 0

Kendo MVC 网格命令按钮未保存在 setOptions 中

我有一个使用命令按钮的 Kendo MVC 网格。这些按钮使用 .Visible 函数调用返回 true/false 的 JS 函数来确定其是否可见。 我也在使用 getOptions/

回答 1 投票 0

Kendo Grid 中的服务器端分页?

我想要 Kendo Grid 中的客户端网格分页。在网格中,第一页中仅显示前 50 或 100 条数据。当客户点击下一页时,将显示其他 50 或 100 条数据。我不想...

回答 3 投票 0

刷新 KendoUI 网格 - 寻呼机损坏

我创建了一个带有分页功能的简单 Kendo UI 网格。现在我想用一些新数据刷新我的网格。我使用 setDatasource 将新数据附加到网格,然后刷新以刷新网格...

回答 1 投票 0

如何以编程方式更改 Kendo UI 网格页面索引?

我有一个剑道用户界面网格。假设指向网格的JS变量称为grid。如何以编程方式转到第 3 页?谢谢。

回答 2 投票 0

选择所有作品可以取消选择部分作品,但不能选择或清除全部作品

我创建了一个启用多选的剑道网格: 我创建了一个启用多选的剑道网格: <kendo-grid [reorderable]="false" class="border" [kendoGridBinding]="data" [selectable]="{ enabled: true, checkboxOnly: false, mode: 'multiple' }" scrollable="none" > <kendo-grid-checkbox-column [showSelectAll]="true" [width]="40" [columnMenu]="false" headerClass="col-header" ></kendo-grid-checkbox-column> <kendo-grid-column title="Person Name" headerClass="font-weight-bold col-header" > <ng-template kendoGridCellTemplate let-dataItem> {{ dataItem.lastName }}, {{ dataItem.firstName }} </ng-template> </kendo-grid-column> 我在 showSelectAll 上使用 kendo-grid-checkbox-column,以便通过标题中的复选框选择所有网格行。我在文档中的 Kendo for Angular 演示中看到了这项工作。 对我来说,当未选择任何内容时,单击标题复选框不会执行任何操作: 当我手动选择一行时,单击显示“-”符号的标题复选框将取消选择选定的行: 当我手动选择所有行时(按住 Shift 键单击它们可以),单击带有复选标记的标题复选框也不起作用: 所以它不适用于选择全部或取消选择全部,但适用于取消选择某些。 有什么想法我做错了什么以及我应该尝试如何让它发挥作用吗? 谢谢! 根据提供的信息,真的很难判断可能导致问题的原因 - 我刚刚使用最新官方版本的 Kendo 包和提供的标记创建了一个 StackBlitz 演示,并且它似乎按预期工作: https://stackblitz.com/edit/angular-gmiahh?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.module.ts 您可以将其与实际实施进行比较并应用必要的调整。 编辑:如果网格恰好与 Angular Material CDK Overlay 一起使用,您还可以查看这篇文章: https://www.telerik.com/kendo-angular-ui/components/knowledge-base/selectall-ngmaterialcdk/ 在对我们自己的问题进行故障排除后(与所描述的问题类似),我发现我们的问题是由变更检测策略引起的。 最初,我们将其设置为: changeDetection: ChangeDetectionStrategy.OnPush 然后我们将其删除,并且它没有对网格造成任何问题。 添加更多功能后,全选停止工作。 重新添加更改检测后,它再次开始工作。 不知道为什么或什么影响它停止工作。

回答 2 投票 0

Telerik Blazor GridCommandButton 不起作用

我一直在与 Blazor 和 Telerik 合作,我似乎有网格显示数据,CSS 看起来不错,但主要使用来自 Telerik 示例的代码,我对它的工作量感到惊讶......

回答 1 投票 0

剑道网格分页不起作用

如何在剑道网格的总属性中分配行数?我使用json来填充数据: if ($结果 = mysqli_query($con,$sql)) { while($obj = mysqli_fetch_object($result)) { $arr...

回答 1 投票 0

在 ASP.NET 中的 Kendo UI Grid 中实现基本分页时出错

我是非常新的 Kendo UI Grid,所以如果这是一个愚蠢的问题,请原谅我。我正在尝试在 asp.net 中实现具有分页功能的基本 Kendo UI 网格。但我在 kendo.web.min.js 中遇到错误。

回答 1 投票 0

如何以编程方式打开和关闭详细模板?

我有 3 列,因此有 3 个单元格,其中有一个按钮。 单击按钮我想打开/关闭详细模板 左侧没有 + 图标 HTML: 我有 3 列,因此有 3 个单元格,其中有一个按钮。 单击按钮我想打开/关闭详细模板 左侧没有 + 图标 HTML: <kendo-grid-column field="info" title="info"> <ng-template kendoGridCellTemplate let-dataItem> <button mat-button (click)="clickInfoCell()"> </button> </ng-template> </kendo-grid-column> <ng-template kendoGridDetailTemplate let-dataItem let-rowIndex="rowIndex"> // DETAIL TEMPLATE BODY </ng-template> TS: public onCellClick(event: CellClickEvent){ this.myEvent= event; } //toggleTemplate public clickInfoCell(){ //Close previous template //Open detail template } 谢谢 实际上有一个内置机制,具有用于此目的的专用指令。 模板: <kendo-grid [kendoGridBinding]="gridView" [kendoGridExpandDetailsBy]="expandDetailsBy" [(expandedDetailKeys)]="expandedDetailKeys" ></kendo-grid> 成分: public expandedDetailKeys: any[] = [1]; public expandDetailsBy = (dataItem: any): any => { return dataItem.ProductID; }; 您可以在此处阅读有关机制的信息。 您可以在 StackBlitz 此处查看工作演示。

回答 1 投票 0

在 Kendo UI 中使用父网格的数据源设置子网格的数据源

我有这个表格: @*这里的一些表单字段接受开始日期和结束日期*@ 搜索 我有这个表格: @*Some form fields here that accept startDate and endDate*@ <div> <button id="searchButton">Search</button> </div> <div class="col-md-12 row"> @(Html.Kendo() .Grid<ProjectName.DataModels.Models.Customer>() .Name("CustomerGrid") .Columns(columns => { columns.Bound(e => e.CustomerId); columns.Bound(e => e.SomeCustomerColumn); }) .ClientDetailTemplateId("OrderDetails") .AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch .DataSource(dataSource => dataSource .Ajax() .Events(events=>events.Change("loadChildGrid")) .PageSize(20) .Model(model => model.Id("CustomerId", typeof(string))) .Read(read => read.Action("GetCustomersAsync", "Customer").Data("passArguments")) ) ) <script id="OrderDetails" type="text/kendo-tmpl"> @(Html.Kendo() .Grid<ProjectName.DataModels.Models.Order>() .Name("OrderDetails_#=CustomerId#") .Columns(columns => { columns.Bound(o => o.ProductName); columns.Bound(o => o.SomeOrderColumn); }) .DataSource(dataSource => dataSource .Ajax() .PageSize(10) .Model(model=>model.Id("OrderId")) .ServerOperation(false) ) .AutoBind(false) .ToClientTemplate() ) </script> </div> <script type="text/javascript"> $("#searchButton").on("click", function () { // Load the customerGrid here: $("#CustomerGrid").data("kendoGrid").dataSource.read(); }); function passArguments() { var startDate = $("#startdate").data("kendoDatePicker").value(); var endDate = $("#enddate").data("kendoDatePicker").value(); return { start: startDate, end: endDate } } // QUESTION: How to load the child grid: OrderDetails_123 by using datasource from the parent grid? // THIS IS WHAT I'VE TRIED SO FAR: function loadChildGrid() { var parentData = $("#CustomerGrid").data("kendoGrid").dataSource.data(); //Initialize the child grid $.each(parentData, childDataFeeder); } function childDataFeeder(index, item) { var childGridName = "#" + "OrderDetails_" + item.CustomerId; var childGrid = childGridName.data("kendoGrid"); childGrid.dataSource.data(value.Orders) } </script> 以及Customer控制器中的方法: public async Task<ActionResult> GetCustomersAsync([DataSourceRequest] DataSourceRequest request, DateTime start, DateTime end) { var customersWithOrders = GetDataForParentAndChildGrid(start, end); return Json(customersWithOrders.ToDataSourceResult(request)); } private List<Customer> GetDataForParentAndChildGrid(DateTime start, DateTime end) { var testData = new List<Customer>(); // Gets required data with those dates filter and perform some mathematical calculations testData.Add(new Customer { CustomerId = "123", SomeCustomerColumn = "Blah blah", Orders = new List<Order>() { new Order{ OrderId = "123ABC", CustomerId = "123", SomeOrderColumn = "Blah Blah Blah" } } }); return testData; } 我的目标是使用主网格中已有的数据设置子网格的数据源。到目前为止我尝试过的是,我已将 Change 事件附加到主网格,该事件会触发 loadChildGrid 函数,我尝试从主网格中提取数据并将其每个项目传递给 childDataFeeder 函数进行初始化子网格的数据源。这里的问题是,当它尝试这样做时,子网格还不存在(因为它不是由 Kendo 创建的,直到用户单击主网格中的展开图标)。 您可以在 childDataFeeder 方法中看到我迄今为止尝试过的内容(没有任何成功)。 因此,我非常感谢您对此的指导。 谢谢您! 经过这么多个小时的点击和尝试,我终于解决了。因此,我将其发布在这里,以节省其他人遇到类似问题的时间: 我在主网格中添加了一个 DetailExpand 事件。并删除了 Change 上的 dataSource 事件。 @(Html.Kendo() .Grid<ProjectName.DataModels.Models.Customer>() .Name("CustomerGrid") .Columns(columns => { columns.Bound(e => e.CustomerId); columns.Bound(e => e.SomeCustomerColumn); }) .ClientDetailTemplateId("OrderDetails") .AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch .DataSource(dataSource => dataSource .Ajax() .PageSize(20) .Model(model => model.Id("CustomerId", typeof(string))) .Read(read => read.Action("GetCustomersAsync", "Customer").Data("passArguments")) ) .Events(events => events.DataBound("dataBound").DetailExpand("onExpand")) ) 现在,每次我们在父网格中展开一行时,都会调用名为 onExpand 的回调函数。我现在将在此处设置子网格的 dataSource。 // Passing e is also important here because if you don't, this callback gets called // for every row in the main grid (even when you don't expand them!) function onExpand(e) { var customerId = e.sender.dataItem(e.masterRow).CustomerId; var orders = e.sender.dataItem(e.masterRow).Orders; //Initialize the child grid as well var childGridName = "#" + "OrderDetails_" + customerId; var childGrid = $(childGridName).data("kendoGrid"); if (childGrid !== undefined) { childGrid.dataSource.data(orders); } } function dataBound() { this.expandRow(this.tbody.find("tr.k-master-row").first()); } 我使用 e.sender.dataItem(e.masterRow).PROPERTYNAME 从主行访问我需要的属性。 现在完美无缺!

回答 1 投票 0

如何防止取消事件更改我的网格行颜色?

我搜索数据,然后绑定到我的网格。在网格的数据绑定事件中,我根据单元格的值更改行背景颜色。这工作正常。但是当我单击网格中的“编辑”按钮时...

回答 5 投票 0

如何从角度过滤器访问值

我正在使用 Kendo Grid 3.6.0 和 Angular 6 以下是我尝试为 Kendo Grid 中的 AssetName 列输入的过滤器 如何将上面屏幕截图中 A254 的值获取到新变量中

回答 2 投票 0

如何以编程方式更改 Angular Kendo UI 网格页面索引?

这个问题是 8 年前提出的,但是 Kendo UI 网格已经发展并且现在支持 Angular。原始问题的答案不适用于 Kendo Grid Angular。 我有剑道网格...

回答 3 投票 0

Kendo Grid 未绑定到数据(使用剃刀页面)

Telerik Kendo 新手,遇到了一个愚蠢的场景,但一直让我抓狂。 无论我做什么,剑道网格根本不会填充数据。 下面是显示测试数据的 Razor 页面...

回答 1 投票 0

Kendo 角度和可延迟视图

Kendo for Angular 是否支持最近 Angular 版本中引入的 @defer 语法? 在我的生产版本中,我的 main.js 版本为 2.1mb(在开发版本中,vendor.js 为 12.1mb)。而且我的速度很慢

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.