Note:
in June 2017, Microsoft disabled the use of JavaScript in a Calculated Column
That means given answers may not apply for newer SharePoint versions
For long explanation and work arounds see:
June 13th 2017 Microsoft blocked handling HTML markup in SharePoint calculated fields - how to get the same functionality back
Original answer:
This whole technique is based on how SharePoint displays the View.
And this code (for every ListItem) is not executed in the visible Row-Order because it runs async (because IMGs load async.. and we need IMGs becuase Microsoft blocked the SCRIPT tag)
Every Row gets a total (but the DIV is hidden)
Every Row starts a setTimout to display the Total
But every next processed row cancels that function again
So the function is executed only once eventually
So all you have to do is delete the code that displays the last total in the last row and write total to someplace else in your page.
replace
& "last.style.display='block';"
with
& "document.getElementById('pageTitle')=total;"
Update #1
For the non-javascript users... that should be:
& "document.getElementById('pageTitle').innerHTML=total;"
--The ViewMaster
Solution
Lucky you! You won the Once-A-Month I really help people who do not understand HTML or Javascript ticket
As I explained every row gets a Total DIV, So all you have to do is display that DIV above the row-calculation and at the end not show the last one, but the first one.
It will mess up the alignment a bit; if you do not want that you need to create a HTML/DIV placeholder on screen and use the innerHTML from above
Now hit that Question Answered button :-)
="<div class=""vmSums"" style=""display:none;font-weight:bold;border-bottom:1px solid black;""></div>"
&"<div style=""color:"
& IF( [Rate]<[Buy] ,"red","green")
& """>"
& DOLLAR( [Qty]*[Rate] )
& "</div>"
& "<img src=""/_layouts/images/blank.gif"" onload=""{"
& "var TBODY=this;TBODY=this;while(TBODY.tagName!='TBODY'){TBODY=TBODY.parentNode};"
& "var dataSum='data-vmSum',dataCnt='data-vmCount',total=value="
& [Qty]*[Rate]
& ",count=0;"
& "if(TBODY.getAttribute(dataSum)){"
& "total=parseFloat(TBODY.getAttribute(dataSum))+value;"
& "count=~~TBODY.getAttribute(dataCnt)+1}"
& "TBODY.setAttribute(dataSum,Number(Math.round(total+'e2')+'e-2').toFixed(2));"
& "TBODY.setAttribute(dataCnt,count);"
& "window.clearTimeout(window.vmSumFunc);"
& "window.vmSumFunc=window.setTimeout((function(){"
& "var lastrownr=~~TBODY.getAttribute(dataCnt),"
& "last=document.getElementsByClassName('vmSums').item(0),"
& "total=parseFloat(TBODY.getAttribute(dataSum)).toFixed(2);"
& "last.textContent='$'+total;"
& "last.style.display='block';"
& "}), 100)"
& "}"">"
CSR version
SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() {
function sumColumn(columnName){
var rows=ctx.ListData.Row; // global ctx!!
var sum=rows.reduce(function(sums,item){ // loop over all Array items
var value=item[columnName];
return sums + (value ? Number(value) : 0); // calculate sums, does not take care of strings!
},0); // sums starts at 0
var id="Sum"+columnName; // unique id so multiple columns can be summed
var sumDIV=document.getElementById(id);
if(!sumDIV){ // if no Sum div exist
sumDIV=document.createElement('DIV');
sumDIV.id=id;
// find column
var header=document.querySelector("[id*='thead-WPQ1'] div[name='"+columnName+"']");
header.appendChild(sumDIV);
}
sumDIV.innerHTML=String.format("<B>Sum: {0}</B>",sum);
}
function init() {
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
Templates: {},
OnPostRender: function(ctx) {
sumColumn('MonthSpan'); // USE INTERNAL FIELD NAME!
},
});
}
RegisterModuleInit(SPClientTemplates.Utility.ReplaceUrlTokens("~siteCollection/Style Library/sumcalculated.js"), init);
init();
});
ICC
