0

KendoUIWebグリッドの簡単な例をまとめました。

<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: '&nbsp;'
                }
            ]
        });
    });
</script>

グリッドが初期化され、正しく表示されます。また、レコードの編集ボタンまたはツールバーの作成ボタンをクリックすると、ポップアップが表示されます。ただし、アニメーション化されているようには見えません。ウィンドウの中央に数ピクセルしか表示されません。

DOMを調べると、これがポップアップの包含要素のスタイルとして示されます。

transform: scale(0.1);

DOMでこれを編集すると、表示が修正されます。ですから、そうではないアニメーションが行われるはずのようです。私のコードにそれを妨げている何か問題がありますか、それとも私が含める必要のある別のリソースがありますか？ポップアップがアクティブなときに押すescと閉じると、小さなアニメーションが表示され、通常のサイズに拡大され、同時にフェードアウトされます。そのため、アニメーションは間違った時間に発生しているように見えます。何か案は？

さらに、ポップアップを閉じると、関連するレコードがグリッドから削除されます。それがなぜ起こっているのか私にはわかりません。しかし、どんなアドバイスでも大歓迎です。ありがとう！

4

2 に答える 2

1

これは私たちが修正したバグのように聞こえます。最新の内部ビルドをダウンロードしてみてください。

于 2012-12-14T17:43:59.497 に答える
0

私も同じ問題を抱えていました。わずかに古いバージョンのjQueryを使用したことが原因であることが判明しました。

KendoUIには現在バージョン1.8.2が必要です

于 2013-02-26T14:23:48.627 に答える