我有一个名称Price and Value。 我正在使用页脚 jqgrid的值。
示例这是2列价格和价值
Price
$25.00000
$33.82000
$1.00000
$21.87125
$9.49000
......
Value
$5,000.00
$8,107.87
$1,344.00
$4,769.01
$5,372.00
...
如何获得价格和价值行的总和 使用页脚数据。
另外，如何将每个row num1 x row num2的值复用并显示在Num1xNum2
即
Num1 Num2 RESULT
4 20 80
这是我的代码。 注意：如果我使用'sum'，它会给我'NaN'值
<!DOCTYPE html>
<html lang="en">
<head>
<!------------------------------------------>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/themes/redmond/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/css/ui.jqgrid.css" />
<style type="text/css">
html, body { font-size: 75%; }
</style>
<script type="text/ecmascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/js/jquery.jqGrid.src.js"></script>
<title>Jqgrid data </title>
</head>
<body>
<div style="margin-left:20px">
<table id="nplGrid"></table>
</div>
<script type="text/javascript">
$(document).ready(function () {
$("#nplGrid").jqGrid({
url: 'json/data-bcp2.json',
datatype: "json",
colModel: [
{ label: 'Id', name: 'Id', width: 145 },
{ label: 'Symbol', name: 'Symbol', width: 90 },
{ label: 'Quantity', name: 'Quantity', width: 100, align: "right" },
/*{ label: 'Value1',
name: 'Value1',
width: 80,
sorttype: 'number',
formatter: 'number',
align: 'right'
}, */
{ label: 'Price', name: 'Price', width: 180, sorttype: 'number' , align: "right",formatter: 'currency', formatoptions: { prefix: " $", suffix: " "}},
{ label: 'Value', name: 'Value', width: 180, sorttype: 'number', align: "right",formatter: 'currency', formatoptions: { prefix: " $", suffix: " "} },
{ label: 'Pledged', name: 'Pledged', width: 80, sorttype: 'integer' } ,
{ label: 'Num2', name: 'Num2', width: 80, formatter:'currency' },
{ label: 'Result', name: 'Result', width: 80,formatter:'currency',
formatter:function(cellvalue, options, rowObject) {
var amount = parseInt(rowObject.Num1,10),
tax = parseInt(rowObject.Num12,10);
return $.fmatter.util.NumberFormat(amount+tax,$.jgrid.formatter.currency);
}
}
],
gridview: true,
rownumbers: true,
sortname: "invdate",
viewrecords: true,
sortorder: "desc",
caption: "Just simple local grid",
height: "100%",
footerrow: true,
loadComplete: function () {
var $self = $(this),
sum = $self.jqGrid("getCol", "Price", false, "sum");
$self.jqGrid("footerData", "set", {invdate: "Total:", Price: sum});
sum1 = $self.jqGrid("getCol", "Value", false, "sum");
$self.jqGrid("footerData", "set", {invdate: "Total:", Value: sum1});
}
});
});
</script>
</body>
</html>
JSON数据
{
"rows":[
{
"Id":"C14999",
"Symbol":"AA",
"Quantity":" 1,000.0000 ",
"Price":" $25.00000 ",
"Value":" $5,000.00 ",
"Pledged":"Y",
"Num1":"4",
"Num2":"20",
"RESULT":""
},
{
"Id":"C14999",
"Symbol":"IRTX",
"Quantity":" 25,343.2250 ",
"Price":" $82000 ",
"Value":" $857,107.87 ",
"Pledged":"Y",
"Num1":"12",
"Num2":"31",
"RESULT":""
},
{
"Id":"C14999",
"Symbol":"MMM",
"Quantity":" 14,344.0000 ",
"Price":" $1.00000 ",
"Value":" $4,344.00 ",
"Pledged":"Y",
"Num1":"22",
"Num2":"20",
"RESULT":""
},
{
"Id":"C14999",
"Symbol":"FMCX",
"Quantity":" 28,565.7660 ",
"Price":" $21.87125 ",
"Value":" $4,769.01 ",
"Pledged":"N",
"Num1":"232",
"Num2":"20" ,
"RESULT":""
},
{
"Id":"C14999",
"Symbol":"CEB",
"Quantity":" 122,800.0000 ",
"Price":" $9.49000 ",
"Value":" $5,372.00 ",
"Pledged":"Y",
"Num1":"2",
"Num2":"10",
"RESULT":""
},
{
"Id":"C23456",
"Symbol":"VETF",
"Quantity":" 1,398,400.0000 ",
"Price":" $2.56000 ",
"Value":" $9,904.00 ",
"Pledged":"Y",
"Num1":"14",
"Num2":"20",
"RESULT":""
}
]
}
答案 0 :(得分：1)
问题在于JSON数据格式错误。您返回在en-US附近的某个区域设置中格式化的字符串（" $857,107.87 "应该被解释为数字857107.87）。此外，数据前置/附加了附加符号（$，空格）。如果您使用sorttype: 'integer（本地数据排序），则无法计算此类错误格式化数据的总和，并且属性loadonce: true也会出错。
通常使用857107.87或"857107.87"而非" $857,107.87 "之类的输入，并使用formatters格式化客户端的数据*。例如，可以使用
{ label: 'Price', name: 'Price', width: 180, sorttype: 'number', align: "right",
formatter: 'currency', formatoptions: { prefix: " $", suffix: " "} }
结果输入数据857107.87或"857107.87"将以" $857,107.87 "的形式显示，但jqGrid可以计算列中的总和。
最后一句话。我不建议您使用旧的4.4.5版本的jqGrid并从URL http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.5/js/jquery.jqGrid.src.js下载它。我在GitHub，CDN上提供了当前版本4.13.1中的免费jqGrid 分叉（请参阅the wiki article，例如https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.13.1/js/jquery.jqgrid.min.js或https://cdn.jsdelivr.net/free-jqgrid/4.13.1/js/jquery.jqgrid.min.js） ，npm，NuGet，bower和Maren central。您可以从消息来源中选择任何一种。