我正在使用ASP.NET WEB API处理jqgrid.
所以在网上进行一点搜索就把我带到了这个链接(2010),上面写着“这是不可能的”,我正在考虑的答案是2010年,可能到现在某些事情/一些解决方法可能已经成为可能.
我想在页脚中显示什么?
我想显示两行
我能够传递数据并读取数据,问题是如何使用这些数据并在jqgrid中创建两个页脚行.
有什么想法吗 ?
解决方法
我发现这个问题很有意思,所以我创建了
the demo,它演示了一个可能实现的两行页脚:
主要思想是在表格中添加标准页脚已存在的第二行.为了消除jqgrid代码的其他部分可能出现的问题,我将自定义行中的footrow类名替换为myfootrow.要为第二个页脚提供与原始tooter相同的CSS设置,我从ui.jqgrid.css中包含了.ui-jqgrid tr.footrow td的副本,其中包含与.ui-jqgrid tr.myfootrow td相同的定义:
.ui-jqgrid tr.myfootrow td { font-weight: bold; overflow: hidden; white-space:Nowrap; height: 21px; padding: 0 2px 0 2px; border-top-width: 1px; border-top-color: inherit; border-top-style: solid; }
您将在下面找到完整的代码
footerrow: true,loadComplete: function () { var $this = $(this),sum = $this.jqgrid("getCol","amount",false,"sum"),$footerRow = $(this.grid.sDiv).find("tr.footrow"),localData = $this.jqgrid("getGridParam","data"),totalRows = localData.length,totalSum = 0,$newFooterRow,i; $newFooterRow = $(this.grid.sDiv).find("tr.myfootrow"); if ($newFooterRow.length === 0) { // add second row of the footer if it's not exist $newFooterRow = $footerRow.clone(); $newFooterRow.removeClass("footrow") .addClass("myfootrow ui-widget-content"); $newFooterRow.children("td").each(function () { this.style.width = ""; // remove width from inline CSS }); $newFooterRow.insertAfter($footerRow); } $this.jqgrid("footerData","set",{invdate: "Total (page):",amount: sum}); // calculate the value for the second footer row for (i = 0; i < totalRows; i++) { totalSum += parseInt(localData[i].amount,10); } $newFooterRow.find(">td[aria-describedby=" + this.id + "_invdate]") .text("Grand Total:"); $newFooterRow.find(">td[aria-describedby=" + this.id + "_amount]") .text($.fmatter.util.NumberFormat(totalSum,$.jgrid.formatter.number)); }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。