论坛首页 Web前端技术论坛

jQuery插件flexigrid使用总结

浏览 90489 次
该帖已经被评为良好帖
作者 正文
   发表时间:2011-01-05  
这个grid能否加上subtotal小计功能?
0 请登录后投票
   发表时间:2011-01-05  
itstarting 写道
这个grid能否加上subtotal小计功能?

有2个思路:
1.后台计算了加到数据里面。
2.前台js操作它里面的dataset,在dataset里面加对应的对象后,再重载下表格。
0 请登录后投票
   发表时间:2011-01-06  
matychen 写道
itstarting 写道
这个grid能否加上subtotal小计功能?

有2个思路:
1.后台计算了加到数据里面。
2.前台js操作它里面的dataset,在dataset里面加对应的对象后,再重载下表格。


还真没这个功能啊
万般无奈之下,自己做了个简单的前端summary功能:
1)定义
{display: 'Price_a', name : 'price', width : 60, align: 'right',summary: 'average:2'},//sum
{display: 'Price_s', name : 'price', width : 60, align: 'right',summary: 'sum:0'},//average
{display: 'Price_c', name : 'price', width : 60, align: 'right',summary: customSum},//custom

custom的话,可以定义个自己的计算方法:
function customSum(arrayOfValue){
	var resultValue = 0.00;
	$(arrayOfValue).each(function(i,value){
		resultValue += parseFloat(value);
	});
	return resultValue.toFixed(3);
}


2)在grid里加了一个方法:
//06012010 add by Bright Zheng
			appendSummaryFooter: function(tbody){
				var data = [];
				for (j=0;j<p.colModel.length;j++){
					var cm = p.colModel[j];
					var summary = cm.summary;
					if(summary){
						var vals = []; 
					    var trs = $(".flexigrid .bDiv table tbody tr"); 
					    if(trs.length > 0){ 
					    	for(var x=0; x<trs.length; x++){
					    		var v = $("td:eq("+j+")",trs[x]).text();
					    		vals.push(v);
			                } 
					    }
					    var resultValue = 0.00;
				    	var fixed = 0;
					    if(typeof(summary)=="function"){
					    	resultValue = summary(vals);
					    }else if(summary.indexOf("average")==0){
					    	var parts = summary.split(":");
					    	fixed = (parts[1] != null) ? parts[1] : 0;
					    	var cnt = 0;
					    	$(vals).each(function(i,value){
					    		cnt++;
					    		resultValue += parseFloat(value);
					    	});
					    	resultValue = resultValue / cnt;
					    	resultValue = resultValue.toFixed(fixed);
					    }else if(summary.indexOf("sum")==0){
					    	var parts = summary.split(":");
					    	fixed = (parts[1] != null) ? parts[1] : 0;
					    	$(vals).each(function(i,value){
					    		resultValue += parseFloat(value);
					    	});
					    	resultValue = resultValue.toFixed(fixed);
					    }
					    //push to the reslut array
					    data.push(resultValue);
					}else{
						data.push("");
					}
				}
				if(data){
			        var footer = $('<tr id="trSummary" style="background:gray"></tr>');
			        $(data).each(function(i,v){
			        	var div = $('<div style="text-align: right;">' + v + '</div>'); 
			        	$(footer).append($('<td align="right"></td>').append(div)); 
			    	});
			        $(tbody).append(footer); 
				}
			}


3)这个方法调用处为原addData的$(t).append(tbody)之后:

				$(t).append(tbody);
				
				//06012010 add by Bright Zheng
				this.appendSummaryFooter(tbody);


呵呵,js始终不是强项,只能说基本可用
0 请登录后投票
   发表时间:2011-01-06  
晕,习惯性的写2010年——那已经是历史了
0 请登录后投票
   发表时间:2011-01-13  
另外,这个UI组件在firefox上会出现拖动后错乱现象。

我还以为楼主修复了呢,我用了你的版本还是有这个问题。

开始状态:



拖动后状态:



  • 大小: 7 KB
  • 大小: 5.4 KB
0 请登录后投票
   发表时间:2011-03-08  
本人也喜欢研究jquery,上面各位的成果,都是大局研究价值的,呵呵,收藏下来研究啦
0 请登录后投票
   发表时间:2011-03-08   最后修改:2011-03-08
我爱死你了,楼主。你加个查询的例子看下?
0 请登录后投票
   发表时间:2011-03-09  
yangguo 写道
我爱死你了,楼主。你加个查询的例子看下?


增加了一些功能:
也来说说jQuery的grid插件Flexigrid的几点重要改进
把这个博客的几个功能加入进来了

新增加了个附件。里面附带了查询功能,jar自己根据classpath下面缺失的查找。

值得下载
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics