设置jqGrid水平滚动条

分手后的思念是犯贱 2021-09-27 16:06 597阅读 0赞

1.html设置css样式

2.js设置

shrinkToFit:false,  
autoScroll: true, //开启水平滚动条

$("#table_list_1").jqGrid({
    	 url : '../../queryAnchorIncomeCount',
    	 mtype : 'POST',
    	 datatype : "json",
    	 styleUI: 'Bootstrap',
    	 postData: {},
    	 colNames : [ '日期', '主播数', '回放数量', '违规', '主播删除', '回放总时长(分钟)', '总收入', '作品总数', '作品收益'],
    	 colModel : [ {name : 'date', index : 'date', width : 150,editable:true,key:true},
    				  {name : 'anchorCount', index : 'anchorCount',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'videoCount', index : 'videoCount',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'violation', index : 'violation',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'anchorDel', index : 'anchorDel',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'videoTotalTime', index : 'videoTotalTime',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'totalCount', index : 'totalCount',editable:true, hidden:true, width : 250, editrules:{required:true}},
    			      {name : 'prodCount', index : 'prodCount',editable:true, width : 150, editrules:{required:true}},
    				  {name : 'prodIncome', index : 'prodIncome',editable:true, width : 150, editrules:{required:true}}
    	 ],
    	 rowNum : 10,
    	 rows : 'abc',
    	 rowList:[10,20,30],
    	 prmNames: {
    	     rows : 'pageSize',
    	     page : 'pageNum',
    	     sort : 'orderBy',
    	     order : 'order'
    	 },
    	 jsonReader : { 
             root: "list", 
             page  : "pageNum", 
             total: "pages",  
             records: "total", 
         },
    	 autowidth:true,
    	 pager : '#pager_list_1',
    	 //sortname : '',
    	 viewrecords : true,
    	 sortorder : "desc",
    	 hidegrid:false,
    	        
    	 shrinkToFit:false,  
    	 autoScroll: true, // 开启水平滚动条
    	        
    	 onSortCol : function(name, index) {
    	     //alert("Column Name: " + name + " Column Index: " + index);
    	 },
    	 ondblClickRow : function(rowid) {
    	     //$("#table_list_1").editGridRow(rowid,editOption);
    	 },
    	 caption : "",
    	 height: 'auto',
    	 editOptions : {
    	     top: 50, left: "100", width: 800 ,closeOnEscape: true, afterSubmit: function(response, postData) {
    	         alert(123);
    	     }
    	 }
    });

3.效果如下

![20190912161815268.png][]

[20190912161815268.png]: /images/20210923/377353060b6646a883cdc04433ab4705.png