Asp.Net MVC结合ExtJs gridPanel 分页和高度自适应

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
Ext.onReady(function () {
    gridPanel();
    var panel = Ext.getCmp('gridPanel');
    window.onresize = function () {
        panel.setHeight(document.documentElement.clientHeight);
    };
});
 
function gridPanel() {
    var pagingBar = Ext.widget('pagingtoolbar', {
        store: store,
        displayInfo: true,
        displayMsg: '显示 {0} - {1} ,共 {2} 记录'
    });
    var panel = new Ext.container.Viewport({
        items: {
            xtype: 'gridpanel',
            id: 'gridPanel',
            store: store,
            height: document.documentElement.clientHeight,
            columns: [
            { header: "Id", flex: 1, dataIndex: 'Id' },
            { header: "标题", width: 200, sortable: false, dataIndex: 'Title' },
            { header: "内容", width: 300, sortable: true, dataIndex: 'Contents' },
            { header: "点击数", width: 80, align: 'center', sortable: true, dataIndex: 'ClickCount' },
            { header: "发表时间", width: 110, sortable: true, dataIndex: 'CreateTime' },
            { header: "更新时间", width: 110, sortable: true, dataIndex: 'UpdateTime' }
            ],
            loadMask: true,
            disableSelection: true,
            viewConfig: {
                stripeRows: true
            },
            tbar: ['->',
                { text: '添加', icon: '../../../Images/extjs/add.png' },
                { text: '编辑', icon: '../../../Images/extjs/pencil.png' },
                { text: '删除', icon: '../../../Images/extjs/delete.png' }
            ],
            bbar: pagingBar
        }
    });
}
 
var store = Ext.create('Ext.data.Store', {
    pageSize: 20,
    fields: ['Id', 'Title', 'Contents', 'ClickCount', 'CreateTime', 'UpdateTime'],
    remoteSort: true,
    proxy: {
        type: 'ajax',
        url: '/Manage/ArticleData',
        reader: {
            type: 'json',
            root: 'topics',
            totalProperty: 'totalCount'
        }
    }
});
 
store.load({ params: { start: 0, limit: 20} });

  MVC:Controller action

1
2
3
4
5
6
7
8
public ActionResult ArticleData(string start, string limit)
       {
           ArticleDal articleDal = new ArticleDal(_session);
           var total = 0;
           var data = articleDal.MyGetAll2(int.Parse(start), int.Parse(limit), ref total);
           var json = Json(new { totalCount = total, topics = data }, JsonRequestBehavior.AllowGet);
           return json;
       }

  数据访问层:Nhibernate分页

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
public IEnumerable<ArticleView> MyGetAll2(int start, int limit, ref int count)
    {
        try
        {
            var query = _session.CreateCriteria<Article>();
            count = query.List<Article>().Count;
            var data = query.SetFirstResult(start)
                            .SetMaxResults(limit)
                            .AddOrder(new Order("CreateTime", false))
                            .List<Article>();
            return ArticleMapper.GetArticleView(data);
        }
        catch (Exception)
        {
            throw;
        }
    }

  

有问题及时和我联系:zhangwei900808@126.com

posted @   Seaurl  阅读(812)  评论(0编辑  收藏  举报
编辑推荐:
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
阅读排行:
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· [AI/GPT/综述] AI Agent的设计模式综述
历史上的今天:
2013-03-06 ASP 迁移到 ASP .NET:需考虑的重要问题
2013-03-06 在ASP与ASP.NET之间共享对话状态
2012-03-06 HTTP 错误 500.19 - Internal Server Error
点击右上角即可分享
微信分享提示