我已经整理了一个简单的KendoUI网格示例:
<div id="peopleGrid"></div>
<link type="text/css" rel="stylesheet" href="/Content/kendoui.web.2012.3.1114.commercial/styles/kendo.common.min.css" />
<link type="text/css" rel="stylesheet" href="/Content/kendoui.web.2012.3.1114.commercial/styles/kendo.default.min.css" />
<script type="text/javascript" src="/Content/kendoui.web.2012.3.1114.commercial/js/kendo.web.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#peopleGrid').kendoGrid({
dataSource: {
type: 'json',
transport: {
read: '/People/JsonTest'
},
schema: {
model: {
fields: {
ID: { type: 'number' },
FirstName: { type: 'string' },
LastName: { type: 'string' }
}
}
},
pageSize: 10,
serverPaging: false,
serverFiltering: false,
serverSorting: false
},
height: 250,
filterable: true,
sortable: true,
pageable: true,
resizable: true,
reorderable: true,
editable: {
mode: 'popup'
},
toolbar: ['create'],
columns: [
{
field: 'ID',
filterable: false,
hidden: true
},
{
field: 'FirstName',
title: 'First Name'
}, {
field: 'LastName',
title: 'Last Name'
},
{
command: ['edit', 'destroy'], title: ' '
}
]
});
});
</script>
网格初始化并且看起来正确。当我单击记录上的编辑按钮或工具栏中的创建按钮时,弹出窗口显示。但是,它似乎不是动画。它在窗口中央只能看到几个像素。
检查DOM会将其显示为弹出窗口包含元素的样式:
transform: scale(0.1);
在DOM中编辑它会修复显示。所以看起来应该有一些动画发生而不是。我的代码中有什么问题阻止它,或者我需要包含其他资源吗?当弹出窗口处于活动状态时,按esc
关闭它会产生一个小动画,可以将其扩展到正常大小,同时将其淡出。所以动画似乎是在错误的时间发生的。有什么想法吗?
此外,我看到当弹出窗口关闭时,关联的记录将从网格中删除。那个我不知道为什么会这样。但任何建议都会非常感激。谢谢!
答案 0 :(得分:1)
这听起来像是我们修复的错误。尝试下载最新的内部版本。
答案 1 :(得分:0)
我遇到了同样的问题。事实证明,这是由于使用了一个稍微过时的jQuery版本。
Kendo UI目前需要1.8.2版本