kendo-ui – Kendo UI网格过滤器无法在引导程序Modal中运行
发布时间:2020-12-16 04:00:37 所属栏目:asp.Net 来源:网络整理
导读:我在Kendo UI网格上遇到了这个奇怪的问题.我有一个可过滤的网格,但它在模态内.但问题是当我过滤一个列(文本列)时,我无法在过滤器文本框中键入.这很奇怪,因为在所有浏览器中它都不起作用.这是我的例子repro Jsfiddle Demo Here div class="container" h3Modal
我在Kendo UI网格上遇到了这个奇怪的问题.我有一个可过滤的网格,但它在模态内.但问题是当我过滤一个列(文本列)时,我无法在过滤器文本框中键入.这很奇怪,因为在所有浏览器中它都不起作用.这是我的例子repro
Jsfiddle Demo Here <div class="container"> <h3>Modal Example</h3> <div> <a href="#myModal1" role="button" class="btn" data-toggle="modal">Launch Modal</a> </div> <!-- Modal --> <div id="myModal1" class="modal hide" tabindex="-1" role="dialog"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3>Kendo Not working on Modal</h3> </div> <div class="modal-body"> <div id="grid" style="height:300px;"></div> </div> <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> <button class="btn btn-primary">Save changes</button> </div> </div> </div> var sharedDataSource = new kendo.data.DataSource({ data: [ { id: 1,value: 10,item: "Item1" },{ id: 2,value: 12,item: "Item2" },{ id: 3,value: 15,item: "Item3" },{ id: 4,value: 18,item: "Item4" },{ id: 5,value: 22,item: "Item5" },{ id: 6,value: 11,item: "Item6" } ],schema: { model: { id: "id",fields: { id: { type: "number",editable: false },value: { type: "number" },item: { type: "string" } } } } }); $("#grid").kendoGrid({ dataSource: sharedDataSource,autoBind: false,editable: true,filterable: true,toolbar: ["save","cancel"] }); sharedDataSource.read(); 解决方法
@Edin的答案是正确的;有用.但原因并不十分清楚.简短的调查导致一个非常简单的修复;只需从模态中删除tabindex,如下所示:
<!-- not working with tabindex --> <div id="myModal1" class="modal hide" tabindex="-1" role="dialog"> <!-- this will --> <div id="myModal1" class="modal hide" role="dialog"> 这也修复了你原来的小提琴. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
推荐文章
站长推荐
- 为什么32位应用程序池在IIS中更有效?
- .net – 使用DataAnnotations 4.0
- asp.net – 在哪里可以下载DLR的Managed JScript
- asp.net-core – 构建asp.net核心错误
- asp.net-mvc – 将参数传递给html partial并在部
- asp.net-mvc-3 – MVC 3传递实体作为接口
- 日志记录 – 如何在ASP.NET MVC 6中注册ILogger进
- asp.net-mvc – MVC .NET模型即时绑定到数组
- asp.net-mvc – 如何将现有的SQL Server数据库添
- asp.net-mvc – 在Html.BeginForm()中使用RouteV
热点阅读