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" }); 隐藏垂直滚动条

             var ids = $("#jqGrid").jqGrid("getDataIDs");

            for (var i = 0; i < ids.length; i++) {
                var rowId = ids[i];
                var rowData = $('#jqGrid').jqGrid('getRowData',rowId);
                var isOnline = rowData.isOnline;

                if (isOnline == 1)
                    $("#" + rowId).find("td").css("background-color", "green");

            }
这段代码为变量组件的所有ROW
$(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" });
        }
    });
});

猜你喜欢

转载自blog.csdn.net/langeldep/article/details/83104205
今日推荐