• Ext.Net学习笔记14:Ext.Net GridPanel Grouping用法


    Ext.Net GridPanel可以进行Group操作,例如:

    image

    如何启用Grouping功能呢?只需要在GridPanel中添加一行配置节点:

    <Features>
        <ext:GridFilters ID="GridFilters1" runat="server" Local="true">
            <Filters>
                <ext:StringFilter DataIndex="Name"></ext:StringFilter>
            </Filters>
        </ext:GridFilters>
        <ext:Grouping runat="server"></ext:Grouping>
    </Features>

    加上这一行代码之后,我们的GridPanel就具备了分组的功能。此时我们的每一列都可以分组,如果要禁用某一列分组,可以使用下面的代码来完成:

    <ext:Column runat="server" ID="columnID" Width="100" Text="ID" DataIndex="ID" 
        Groupable="false"></ext:Column>

    在Column中添加Groupable属性,并将值设置为false,就可以禁用列的分组功能。

    自定义Group标题

    我们可以自定义Group的标题:

    <ext:Grouping runat="server" GroupHeaderTplString="{columnName}:{name}"></ext:Grouping>

    自定义标题是通过Tpl模板来实现的,因此我们只要符合Tpl的格式就可以了。

    下面我们为标题添加上分组的行数:

    image

    代码如下:

    <ext:Grouping runat="server" 
        GroupHeaderTplString="{columnName}:{name}{[MyApp.formatGroupSummary(values)]}"></ext:Grouping>

    JS方法:

    var MyApp = {
        formatGroupSummary: function (values) {
            var rows = values.rows,
            numRows = rows.length;
            return Ext.String.format("(共 {0} 条)", numRows);
        }
    };

    注意,Group分组只对当前页有效,并且只在客户端完成。

     

  • 相关阅读:
    ASP.NET MVC 以Stream 下载文件
    ITextSharp 初次接触
    Easyui中tree组件实现搜索定位功能及展开节点定位
    lodop 打印控件的使用
    XML IList<T> TO DataSet TO DataTable 相互转换
    JSONToObejct 问题 part 1
    可以动态添加图片的轮播插件
    防止机器注册
    sqlServer 取每组的前几条数据
    log4net 动态设定日志文件名
  • 原文地址:https://www.cnblogs.com/youring2/p/3568350.html
Copyright © 2020-2023  润新知