JSLINK显示我的列表视图字段的总和将仅显示当前页面内当前项目的总和，而不显示整个列表内 [英] JSLINK to show the Sum of my list view fields will only show the Sum for the current items inside the current Page, and not inside the whole list

问题描述

我正在处理一个列表，我想在列表视图中显示项目总数.因此，正如在Technet文章中提到的那样，我编写了以下JSLINK:

I am working on a list and I want to show the Sum of items inside my list view. so as mentioned in this Technet article, I wrote the following JSLINK:

var _totalValue = 0.0;
var _totalColumn = 6;  // Specify total number of columns in list view.
var _columnIndex = 6;  // Specify the index of the column where you want to display sum values. (i.e. index for first column = 1)
(function () {
     
    var calculatedFieldCtx = {};  
   
    calculatedFieldCtx.Templates = {};
 
    calculatedFieldCtx.Templates.Fields = {
        "Total_x0020_billing": {
            "View": CalculatedFieldViewTemplate
        }
    };
 
    calculatedFieldCtx.OnPostRender = [];
    calculatedFieldCtx.OnPostRender.push(function()
    {  
        // Specify id of the list view table for which you want to display sum values. 
        var HTMLTableElement = document.getElementById("{ED71D9A3-58E5-44A8-B3F7-EC3AD763A558}-{F04B2518-5A35-4EEF-A0AE-1B9B64EA0947}");
 
                var tbodyElement = document.createElement('thead');
                tbodyElement.id = "customAggWPQ";
 
                var trElement = document.createElement('tr');
                 
                var tdElement;
                for(var i = 1; i <= _totalColumn; i++) {
                        tdElement = document.createElement('th');
                        tdElement.id = "tdElement" + i;
                        if( i == _columnIndex) {
                              tdElement.innerHTML = "<b>Sum= " + numberFormat(_totalValue) + "</b>";
                        }
                        trElement.appendChild(tdElement);
                }
                 
        tbodyElement.appendChild(trElement);
        if(document.getElementById("customAggWPQ") == null) {
                HTMLTableElement.insertBefore(tbodyElement,HTMLTableElement.firstChild.nextSibling);
        }
        else {
                document.getElementById("tdElement" + _columnIndex).innerHTML = "<b>Sum= " + numberFormat(_totalValue) + "</b>";
        }
        _totalValue = 0.0;
    })
 
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(
        calculatedFieldCtx
    ); 
})();
 
 
function CalculatedFieldViewTemplate(ctx) {       
    _totalValue += parseFloat((ctx.CurrentItem.Total_x0020_billing).replace(',', ''));
    return ctx.CurrentItem.Total_x0020_billing;
}
 
var numberFormat = function(number) {
        var sDelimeter = ',';
        number = Math.round(parseFloat(number) * 100) / 100;
        var numStr = ('_' + number).replace('_', '');
        var buffer = [];
        for (var i = 0, len = numStr.length; i < len; i += 1) {
            buffer.push(numStr.substring(len - 1 - i, len - i));
            if (((i + 1) % 3 == 0) && (i != len - 1)) {
                buffer.push(sDelimeter);
            }
        }
        return buffer.reverse().join('').replace(",.", ".");
};

但是我面临的问题是JSLINK将按页面而不是按列表视图显示SUM.因此，如果我有200个项目的列表视图，并且每页显示10个项目，那么SUM将分别是每10个项目的总和.

but the problem I am facing is that the JSLINK will show the SUM per page and not per list view. so if I have a list view of 200 items and I am showing 10 items per page.. then the SUM will be the sum for each 10 items separately.

要提到的一个注释是，我想显示计算列的总和，这就是为什么在列表视图设置中使用内置的总计"部分对我来说是无益的，因为它不支持计算列..

One note to mentioned that i want to show the Sum for calculated columns, that why using the built-in Total section inside my list view settings will not be beneficial to me as it does not support calculated columns..

推荐答案

你好，

为什么使用JSlink?

Why use JSlink? 

您可以为此使用开箱即用功能.只需转到修改列表"视图的总计"选项卡，然后选择要显示的总计列.选择求和操作.

You can use out of box feature for this. Just go to Modify List view, Total Tab and select the Total for column you want to be displayed. Select Sum Action.

谢谢！

这篇关于JSLINK显示我的列表视图字段的总和将仅显示当前页面内当前项目的总和，而不显示整个列表内的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！