Ext.grid.Panel表格分页
生活随笔
收集整理的這篇文章主要介紹了
Ext.grid.Panel表格分页
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
Ext.grid.Panel表格分頁示例
代碼：
cshtml
@{Layout = null; } <!DOCTYPE html> <html> <head><title>Ext.grid.Panel動態(tài)加載分頁數(shù)據(jù)</title><link href="@Url.Content("~/Scripts/ext-4.0.7-gpl/resources/css/ext-all.css")" rel="stylesheet" type="text/css" /><script src="@Url.Content("~/Scripts/ext-4.0.7-gpl/bootstrap.js")" type="text/javascript"></script><script type="text/javascript">Ext.require(['Ext.grid.*','Ext.toolbar.Paging','Ext.data.*']);Ext.onReady(function () {Ext.define("Province", {extend: "Ext.data.Model",fields: [{ name: "ProvinceID" },{ name: "ProvinceNo" },{ name: "ProvinceName" }]});var store = Ext.create("Ext.data.JsonStore", {pageSize: 10, // 分頁大小 model: "Province",proxy: {type: "ajax",url: "/Province/List",reader: {type: "json",root:"root",totalProperty: 'totalProperty'}}});store.loadPage(1);Ext.create("Ext.grid.Panel", {title: "Ext.grid.Panel",renderTo: Ext.getBody(),frame: true,height: 310,width: 400,store: store,columns: [{ header: "ID", width: 50, dataIndex: "ProvinceID", sortable: true },{ header: "編號", width: 100, dataIndex: "ProvinceNo", sortable: true },{ header: "名稱", width: 135, dataIndex: "ProvinceName", sortable: true }],bbar: Ext.create('Ext.PagingToolbar', {store: store,displayInfo: true,displayMsg: '顯示{0}-{1}條，共{2}條',emptyMsg: "沒有數(shù)據(jù)"})});});</script> </head> <body> </body> </html>controller
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc;using Northwind.Domain.Entities; using Northwind.Data; using Northwind.Service;namespace Northwind.Web.Controllers {public class ProvinceController : Controller{private IProvinceService provinceService;public ProvinceController(IProvinceService provinceService){this.provinceService = provinceService;}public ActionResult Grid(){return View();}/// <summary>/// 省份分頁數(shù)據(jù)/// </summary>/// <param name="page">當(dāng)前頁</param>/// <param name="limit">分頁大小</param>/// <returns></returns>public JsonResult List(int page, int limit){int totalRecords;return Json(new { root = provinceService.GetPaged(page, limit, out totalRecords), totalProperty = totalRecords }, JsonRequestBehavior.AllowGet);}} }效果圖：
總結(jié)
以上是生活随笔為你收集整理的Ext.grid.Panel表格分页的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Linux /etc/inittab
- 下一篇： .NET独有的精巧泛型设计模式