辽宁省建设银行网站,wordpress阅读式主题,广元建设厅官方网站,上海搬家公司收费标准下面直接给你最实用、最常见的列运算#xff08;calculated column 底部合计统计#xff09;方法#xff0c;jQuery EasyUI datagrid 支持超级好#xff0c;复制粘贴就能用#xff0c;领导最爱的“单价*数量金额自动计算 底部总金额/平均值”全都有#xff01;
方法1calculated column 底部合计统计方法jQuery EasyUI datagrid 支持超级好复制粘贴就能用领导最爱的“单价*数量金额自动计算 底部总金额/平均值”全都有方法1行内计算列比如金额 单价 × 数量编辑时自动计算结合行内编辑超级实用tableiddgclasseasyui-datagridtitle列运算 底部合计stylewidth:800px;height:400pxdata-optionsurl:data.json, singleSelect:true, fitColumns:true, pagination:true, showFooter:true, onClickRow:onClickRow, onEndEdit:onEndEdittheadtrthdata-optionsfield:id,width:60ID/ththdata-optionsfield:name,width:120商品名称/ththdata-optionsfield:price,width:100,align:right,editor:{type:numberbox,options:{precision:2}}单价/ththdata-optionsfield:quantity,width:100,align:right,editor:{type:numberbox,options:{precision:0,min:1}}数量/ththdata-optionsfield:amount,width:120,align:right, formatter:function(value,row){return (row.price*row.quantity).toFixed(2);}金额自动计算/th/tr/thead/tablescript// 行内编辑核心和之前一样vareditIndexundefined;functionendEditing(){if(editIndexundefined){returntrue}if($(#dg).datagrid(validateRow,editIndex)){$(#dg).datagrid(endEdit,editIndex);editIndexundefined;returntrue;}else{returnfalse;}}functiononClickRow(index){if(editIndex!index){if(endEditing()){$(#dg).datagrid(selectRow,index).datagrid(beginEdit,index);editIndexindex;}else{$(#dg).datagrid(selectRow,editIndex);}}}// 编辑结束时自动计算金额functiononEndEdit(index,row,changes){if(changes.price||changes.quantity){row.amount(row.price||0)*(row.quantity||1);$(#dg).datagrid(refreshRow,index);// 可选更新底部合计updateFooter();}}// 加载成功后计算底部合计functionupdateFooter(){varrows$(#dg).datagrid(getRows);vartotalAmount0;vartotalQuantity0;$.each(rows,function(i,row){totalAmount(row.price||0)*(row.quantity||1);totalQuantity(row.quantity||1);});varavgPricetotalQuantity?(totalAmount/totalQuantity).toFixed(2):0;$(#dg).datagrid(reloadFooter,[{name:b合计/b,price:,quantity:totalQuantity,amount:totalAmount.toFixed(2) (平均单价: avgPrice)}]);}$(function(){$(#dg).datagrid({onLoadSuccess:function(){updateFooter();}});});/script效果编辑单价或数量时金额列自动计算并刷新底部固定显示“合计”行总金额 平均单价超级专业方法2纯客户端动态追加“合计”行不依赖后台footer适合本地数据或不想改后台的情况。functioncompute(columnField){varrows$(#dg).datagrid(getRows);vartotal0;for(vari0;irows.length;i){totalparseFloat(rows[i][columnField]||0);}returntotal.toFixed(2);}$(#dg).datagrid({onLoadSuccess:function(){$(this).datagrid(appendRow,{name:span stylefont-weight:bold;合计/span,amount:span stylefont-weight:bold;compute(amount)/span});}});方法3后台直接返回footer最省事如果能改后台后台JSON格式{total:20,rows:[/* 数据行 */],footer:[{name:合计,amount:99999.99}]}前端只需加showFooter:true自动显示底部合计你现在直接复制方法1到你的页面刷新就能看到列运算 底部合计效果了结合之前的复选框 分页 行内编辑 扩展编辑器完美财务/订单报表就齐活了。想要我给你一个完整的HTML示例带远程数据 多列运算 总计/平均/最大值 保存到服务器或者你告诉我你想计算什么比如“成本 单价数量折扣”、“选中行合计”我2分钟发你完整代码复制就能跑快说说你现在的需求比如“要分组统计”或“分页时每页合计”我手把手帮你搞定5分钟内看到完美列运算效果