0

asp.net MVC でグリッドを使用しています。現在、グリッドは、グリッドに入る を.DataSource(c => c.Read())返す URL を呼び出すために使用しています。IEnumerable<item>

グリッドにページングを実装したいと考えています。ただし、データには通常のページング方法 (カウント、ページ番号など) がありません。

代わりに、内部でデータを取得すると、次のようにデータが返されます。

{ items: [. . . ], nextPage: 'J23jeg9e93', previousPage: 'oqow0r93285' }

次のページを取得するには、データのリクエストを再度行う必要がありますが、次または前のページのページング トークンを含めます。

現時点では、items 配列をグリッドに返すだけなので、nextPage/previousPage メタデータはありません。

このメタデータを含める方法がわかりません。アイテムの IEnumerable を返すだけなので、メタデータを入れるラッパー オブジェクトがありません。

を使用.Data()して読み取り要求にメタデータを添付できますが、その逆を行う必要があります。メタデータを取得したら、送信できるようにそれを JavaScript 変数に格納できるようにする必要があります。.Data()

4

1 に答える 1

1

NextPage、PreviousPage 操作を実際にどのようにトリガーしているかはわかりませんが...

MVC カスタム DataSource 構成を使用して、スキーマ構成などのその他のオプションへのアクセスを提供できます。 http://docs.telerik.com/aspnet-mvc/getting-started/custom-datasource

スキーマ構成を使用すると、カスタムの結果形式を取ることができる解析関数を追加できます。

{ items: [. . . ], nextPage: 'J23jeg9e93', previousPage: 'oqow0r93285' }

アイテムを抽出し(グリッドに渡すため)、およびnextPage、previousPageの値(次の読み取りリクエストに渡すために保存するため)。

例えば:

サンプル グリッド:

@(Html.Kendo().Grid<TelerikMvcApp4.Models.GridViewModel>()
.Name("grid")
.DataSource(ds => ds
    .Custom()
    .Batch(true)
    .Schema(schema => schema
        .Parse(@<text>parseData</text>)
    )
    .Transport(transport => transport
        .Read(read => read.Action("Grid_Read", "Home").Type(HttpVerbs.Post).Data("readData"))
    )
    .PageSize(1)
    .ServerPaging(true)
)
.Pageable()
)

parseData および readData JavaScript のサンプル:

<script>
var nextPage,
    previousPage;
function readData() {
    // Return the "extra" data that should be posted with each grid read request, which is the nextPage/previousPage we were given in the previous request respsonse.
    return {
        nextPage: nextPage,
        previousPage: previousPage
    };
}
function parseData(data) {
    // Parse the response from the server as it isn't in the typical format expected by the grid.

    // Extract your nextPage/previousPage, store it somewhere so they can be added to the next grid request.
    nextPage = data.nextPage;
    previousPage = data.previousPage;

    // Return the actual data that should be displayed in the grid.
    return data.items;
}
</script>

グリッド読み取りアクションの例:

[HttpPost]
    public ActionResult Grid_Read([DataSourceRequest] DataSourceRequest request, string nextPage, string previousPage)
    {

        // "Fetch" the data, presumably doing something with nextPage and previousPage...
        var items = new List<GridViewModel>()
        {
            new GridViewModel() { name = "bob", age = 23},
            new GridViewModel() { name = "jim", age = 43},
        };
        // Determine what the new nextPage, previousPage should be...
        var newNextPage = "J23jeg9e93";
        var newPreviousPage = "oqow0r93285";

        return Json(new
        {
            items = items,
            nextPage = newNextPage,
            previousPage = newPreviousPage
        });
    }

これは完全で堅牢なソリューションではありませんが、実行可能にすることができ、少なくとも可能な方向性を示すことができると思います.

于 2017-02-03T14:30:19.127 に答える