1. 程式人生 > >jqGrid元件顯示滾動條

jqGrid元件顯示滾動條

如下為顯示滾動條的核心配置
shrinkToFit:false,
autoScroll: true,

autowidth:true,

$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "auto" }); 需要拖拉才能顯示水平滾動條 $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-y" : "auto" }); 需要拖拉才能顯示垂直滾動條

$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "scroll" }); 一直顯示水平滾動條 $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-y" : "scroll" }); 一直顯示垂直滾動條

$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 隱藏水平滾動條 $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-y" : "hidden" }); 隱藏垂直滾動條

$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'sys/prjbasicinfo/list',
        datatype: "json",
        colModel: [
			{ label: 'id', name: 'id', index: 'id', width: 50, key: true },
			{ label: '租戶ID', name: 'tenantId', index: 'tenant_id', width: 80 }, 			
			{ label: '工程名稱', name: 'prjName', index: 'prj_name', width: 100 },
			{ label: '開工日期', name: 'beginTime', index: 'begin_time', width: 100 },
			{ label: '竣工日期', name: 'completedTime', index: 'completed_time', width: 100 },
			{ label: '所在省', name: 'prjProvince', index: 'prj_province', width: 80 }, 			
			{ label: '所在市', name: 'prjCity', index: 'prj_city', width: 80 }, 			
			{ label: '區縣', name: 'prjDistrictCounty', index: 'prj_district_county', width: 80 }, 			
			{ label: '物業名稱', name: 'prjCommunity', index: 'prj_community', width: 80 }, 			
			{ label: '安裝位置', name: 'installPosition', index: 'install_position', width: 80 }, 			
			{ label: '經度', name: 'geoLng', index: 'geo_lng', width: 70 },
			{ label: '緯度', name: 'geoLat', index: 'geo_lat', width: 70 },
			{ label: '專案負責人', name: 'prjLeader', index: 'prj_leader', width: 80 }, 			
			{ label: '專案TEL', name: 'prjLeaderTel', index: 'prj_leader_tel', width: 80 }, 			
			{ label: '售後負責人', name: 'aftersaleLeader', index: 'aftersale_leader', width: 80 }, 			
			{ label: '售後TEL', name: 'aftersaleLeaderTel', index: 'aftersale_leader_tel', width: 80 }, 			
			{ label: '所有方', name: 'prjOwner', index: 'prj_owner', width: 80 }, 			
			{ label: '所有方TEL', name: 'prjOwnerTel', index: 'prj_owner_tel', width: 80 }			
        ],
		viewrecords: true,
        height: 385,
        rowNum: 10,
        shrinkToFit:false,
        autoScroll: true,
        rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 35,
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
        	//隱藏grid底部滾動條
            //$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });
            //顯示grid底部滾動條
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "scroll" });
        }
    });
});