FineUI 官方论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

本论坛已关闭(禁止注册、发帖和回复)
请移步 三石和他的朋友们

FineUI首页 WebForms - MVC & Core - JavaScript 常见问题 - QQ群 - 十周年征文活动

FineUI(开源版) 下载源代码 - 下载空项目 - 获取ExtJS - 文档 在线示例 - 版本更新 - 捐赠作者 - 教程

升级到 ASP.NET Core 3.1,快、快、快! 全新ASP.NET Core,比WebForms还简单! 欢迎加入【三石和他的朋友们】(基础版下载)

搜索
查看: 4445|回复: 6
打印 上一主题 下一主题

FineUI4合计行JS版本不能防止重复添加合计行

[复制链接]
跳转到指定楼层
楼主
发表于 2015-5-22 13:09:02 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
用户要求在表格中添加两个合计行,我在DEMO中似乎没有找到相关的实例。
于是参考http://www.fineui.com/bbs/forum. ... tid=1574&highlight=合计行
中的FineUI3的合计行JS版本改写如下,因为对ExtJS还处于摸索阶段,在防止重复添加合计行
那里卡住了,表格中显示的合计行出现重复添加的情况,请大家帮忙看看是哪里写的有问题,多谢了!
<script src="../res/js/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        var gridClientID = '<%= Grid2.ClientID %>';

        function calcGridSummary(grid) {
            var G001bTotal = 0, store = grid.getStore(), view = grid.getView(), storeCount = store.getCount();

            // 防止重复添加了合计行
            //if (Ext.get(view.getNode(storeCount - 1)).hasClass('mygrid-row-summary')) {
            //    return;
            //}
            //console.log(view.getNode(storeCount - 1));
            console.log(0);

            if ($(view.getNode(0)).hasClass('mygrid-row-summary'))
            {
                console.log(2);
                return;
            }

            // 遍历每一行数据,计算汇总数据
            store.each(function (record) {
                // 注:donate是列的ColumnID属性
                if (record.get('TOTALb') == '保税区')
                {
                    G001bTotal += parseInt(record.data["G001b"]);

                }
            });

            Ext.regModel('pen', {
                fields: [{
                    name: 'TOTALb',
                    type: 'string'
                }, {
                    name: 'G001b',
                    type: 'auto'
                }, {
                    name: 'G002b',
                    type: 'auto'
                }, {
                    name: 'G003b',
                    type: 'auto'
                }, {
                    name: 'G004b',
                    type: 'auto'
                }],

            });

            var p = new pen({
                TOTALb: '保税区合计',
                G001b: G001bTotal,
                G002b: G001bTotal,
                G003b: G001bTotal,
                G004b: G001bTotal
            });
            console.log(1);
            store.insert(0, p);
            //store.add(p);
            // 为合计行添加自定义样式(隐藏序号列、复选框列,取消 hover 和 selected 效果)
            $(view.getNode(0)).addClass('mygrid-row-summary');
            console.log(view.getNode(0));
            console.log(3);
        }
        // 页面第一个加载完毕后执行的函数
        F.ready(function () {
            var grid = F(gridClientID);
            grid.addListener('viewready', function () {
                calcGridSummary(grid);
            });

            // 防止选中合计行
            grid.getSelectionModel().addListener('beforerowselect', function (sm, rowIndex, keepExisting, record) {
                if ($(view.getNode(0)).hasClass('mygrid-row-summary')) {
                    return false;
                }
                return true;
            });
            console.log('ready');
        });

        // 页面AJAX回发后执行的函数
        F.ajaxReady(function () {

            var grid = F(gridClientID);
            calcGridSummary(grid);
            console.log('ajaxReady');
        });

    </script>

沙发
 楼主| 发表于 2015-5-22 13:10:17 | 只看该作者
Grid2的内容:
<f:Tab ID="Tab2" Title="按区域" runat="server" Layout="Fit">
                            <Items>
                                <f:Grid ID="Grid2" ShowBorder="true" ShowHeader="false" runat="server" EnableFrame="false" EnableCollapse="false"
                                    EnableTextSelection="true" EnableColumnLines="true"
                                    EnableSummary="true" SummaryPosition="Top">
                                    <Columns>
                                        <f:RowNumberField EnablePagingNumber="true" Width="30px" />
                                        <f:BoundField DataField="grp" ColumnID="TOTALb" HeaderText="区域" TextAlign="Center" Width="200px" />
                                        <f:BoundField DataField="G001" ColumnID="G001b" HeaderText="新批企业个数" TextAlign="Center" />
                                        <f:BoundField DataField="G002" ColumnID="G002b" HeaderText="投资总额(万美元)" TextAlign="Right" DataFormatString="{0:F}" Width="130px" />
                                        <f:BoundField DataField="G003" ColumnID="G003b" HeaderText="注册资本(万美元)" TextAlign="Right" DataFormatString="{0:F}" Width="130px" />
                                        <f:BoundField DataField="G004" ColumnID="G004b" HeaderText="合同外资(万美元)" TextAlign="Right" DataFormatString="{0:F}" Width="130px" />
                              
                                    </Columns>
                                </f:Grid>
                            </Items>
                        </f:Tab>
板凳
 楼主| 发表于 2015-5-22 13:10:45 | 只看该作者
CSS的内容:
<style>
        .x-grid-row-summary .x-grid-cell-inner {
            font-weight: bold;
            color: red;
        }

        .x-tab-default-top .x-tab-inner {
            height: 14px !important;
            line-height: 14px !important;
        }
        .mygrid-row-summary.x-grid3-row
        {
            background-color: #efefef !important;
            background-image: none !important;
            border-color: #fff #ededed #ededed !important;
        }
        .mygrid-row-summary.x-grid3-row .x-grid3-td-numberer, .mygrid-row-summary.x-grid3-row .x-grid3-td-checker
        {
            background-image: none !important;
        }
        .mygrid-row-summary.x-grid3-row .x-grid3-td-numberer .x-grid3-col-numberer, .mygrid-row-summary.x-grid3-row .x-grid3-td-checker .x-grid3-col-checker
        {
            display: none;
        }
        .mygrid-row-summary.x-grid3-row td
        {
            font-size: 14px;
            line-height: 16px;
            font-weight: bold;
            color: red;
        }
    </style>
地板
发表于 2015-5-22 16:31:28 | 只看该作者
本帖最后由 飞↑草 于 2015-5-22 16:38 编辑

敬佩下LZ的霸气~
5#
 楼主| 发表于 2015-5-22 17:12:44 | 只看该作者

啊?!咋啦。。。。。
6#
发表于 2015-5-25 08:47:58 | 只看该作者
tarcyshu 发表于 2015-5-22 17:12
啊?!咋啦。。。。。

我只会后台弄,不会JS拉
7#
 楼主| 发表于 2015-5-25 09:49:24 | 只看该作者
飞↑草 发表于 2015-5-25 08:47
我只会后台弄,不会JS拉

后台fineui只能返回一条合计行吧?或者用SQL弄?
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|FineUI 官方论坛 ( 皖ICP备2021006167号-1 )

GMT+8, 2024-11-2 17:22 , Processed in 0.044902 second(s), 17 queries , Gzip On.

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表