`
TreasureNow
  • 浏览: 19963 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
社区版块
存档分类
最新评论

jqgrid thousand seperator,Col background and colspan setting

阅读更多
// 我从后台动态生成的列,大家注意列的属性设置即可,以下是 action 代码

		//----------以上添加了固定列;可变列要动态的从页面接收,或者从数据库中选取
			List<String> companyList = materialStockedService.ListCompanies();
			
			for (String company : companyList){
				//合并的列名称
				String spaned_quantity_name = "SUM_Quantity_" + company;
				String spaned_money_name = "SUM_TotalMoneyOTax_" + company;
				
				coln_list.add(common_col_left);
				coln_list.add(common_col_right);
				
				//合并的列(数量)
				colm_map = new HashMap<String, Object>();
				colm_map.put("name", spaned_quantity_name);
				colm_map.put("index", spaned_quantity_name);
				colm_map.put("resizable", true); 
				colm_map.put("width", 100);
				colm_map.put("sortable", false);
				colm_map.put("formatter", "number");
				colm_map.put("formatoptions", "{thousandsSeparator: ','}");
				colm_map.put("align", "right");
				colm_list.add(colm_map);
				
				//合并的列(金额)
				colm_map = new HashMap<String, Object>();
				colm_map.put("name", spaned_money_name);
				colm_map.put("index", spaned_money_name);
				colm_map.put("resizable", true); 
				colm_map.put("width", 100);
				colm_map.put("sortable", false);
				colm_map.put("classes", "cvteste");
				colm_map.put("formatter", "number");
				colm_map.put("formatoptions", "{thousandsSeparator: ','}");
				colm_map.put("align", "right");
				colm_list.add(colm_map);
				
				//合并的数目,从那个字段开始合并
				colspan_map = new HashMap<String, Object>();
				colspan_map.put("startColumnName", spaned_quantity_name);
				colspan_map.put("numberOfColumns", 2);
				colspan_map.put("titleText", company);
				colspan_list.add(colspan_map);
			}
			jsonObj.put("ColN", coln_list);						
			jsonObj.put("ColM", colm_list);
			jsonObj.put("groupHeaders", colspan_list);			
			jsonObj.put("success", "success");




 

// 以下是 js 代码

			$.ajax({
	            url: 'getCompanyGridCol.action',
	            type: "POST",
	            contentType: "application/json; charset=utf-8",
	            data: {},
	            dataType: "json",
	            success: function (data) {	            	
	                if (data.success == "success") {
	                    ColN = data.ColN;//jqgrid heading data	                   
	                    ColM = data.ColM; // its column model
	                    GroupHeaders = data.groupHeaders;	                  
	                    /*var array = new Array();
	                    $.each(ColM, function(n, value){                    	                    	
	                    	if (value['name'] == "MaterialCategory"){
	                    		value['cellattr'] = arrtSetting;
	                    		array.push(value);	                    	
	                    	} else {
	                    		array.push(value);
	                    	}
	                    })*/
	                    //ColM = array;	                                  
	                    //ColD = data.rows; // Data
	                    createGrid();
	                }
	            },
	            
	            error: function () {
	                alert("Error with AJAX callback");
	            }
	        }) 
			resizeGrid();
		})

		function createGrid(){
			$("#gridTable").jqGrid({
				url: "ListCompanyGrid.action",
				datatype: "json",
				autowidth: true,
				shrinkToFit: false,
				height: $('body').height() - 110,
				width : 700,
                colNames: ColN,
                colModel: ColM,
		        datatype: "json",
		        hidegrid: false,
		        jsonReader: {
		             repeatitems: false
		        },
		        // 允许多选
		        multiselect: false,

		        // 显示序列号
		 	    sortable: false,
		        pager:"#gridPaper",
		        viewrecords: true,
		        rowNum: 2000,
		        loadComplete: function() {

			    },
			    
			    loadError: function(xhr,status,error){  
       				alert(status + " loading data of " + $(this).attr("id") + " : " + error );   
       		    }
		    })
		    
			ColSpan(GroupHeaders);
			jQuery("#gridTable").jqGrid('setFrozenColumns');
			jQuery("#gridTable").triggerHandler("jqGridAfterGridComplete");
	    }
	    
	    function ColSpan(data){
   			jQuery("#gridTable").jqGrid('setGroupHeaders', {
			  	useColSpanStyle: true, 
			  	groupHeaders: data
			});	
	   }

 

 实现的效果如下

 



 

 

  • 大小: 52.4 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics