jqgrid 不能列冻结

Expectation 发布于 2014/03/26 13:50
阅读 2K+
收藏 0

本人最近在学习jqgrid ,弄到列冻结的时候,特别纠结,居然使用不了,在网上查了很久也没有找出原因,求大神解答




<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>grid jsp2</title>

<link rel="stylesheet" type="text/css" media="screen"
    href="jqgrid/css/ui-lightness/jquery-ui-1.10.4.custom.css" />
<link rel="stylesheet" type="text/css" media="screen"
    href="jqgrid/css/ui.jqgrid.css" />

<style>
html,body {
    margin: 0;
    padding: 0;
    font-size: 75%;
}
</style>
<script src="jqgrid/jquery.jqGrid-4.6.0/js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="jqgrid/jquery.jqGrid-4.6.0/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="jqgrid/jquery.jqGrid-4.6.0/js/jquery.jqGrid.src.js" type="text/javascript"></script>



<script type="text/javascript">
    $(document).ready(function() {
        $("#test").jqGrid({
            url : "test.action",
            datatype : "json",
            mtype : "post",
            colNames : [ '编号', '用户名', '性别', '邮箱', 'QQ', '手机号', '出生日期' ],
            colModel : [ {
                name : 'id',
                index : 'id',
                align : 'center',
                width : 200,
                frozen : true,
            }, {
                name : 'userName',
                index : 'userName',
                width : 500,
                align : 'center',
                frozen : true,
            }, {
                name : 'gender',
                index : 'gender',
                width : 500,
                align : 'center'
            }, {
                name : 'email',
                index : 'email',
                width : 500,
                align : 'center'
            }, {
                name : 'QQ',
                index : 'QQ',
                width : 500,
                align : 'center'
            }, {
                name : 'mobilePhone',
                index : 'mobilePhone',
                width : 500,
                align : 'center'
            }, {
                name : 'birthday',
                index : 'birthday',
                align : 'center',
                width : 500,
                formatter : 'date',
                formatoptions : {
                    newformat : 'YⓂd'
                },
                datefmt : 'YⓂd'
            } ],
            sortname : 'id',
            rowNum : 10,
            sortorder : 'desc',
            shrinkToFit : false,
            height : 'auto',
            width : 500,
            rownumbers : true,
            rowList : [ 10, 20, 30 ],
            jsonReader : {
                root : "dataRows", // 数据行(默认为:rows)
                repeatitems : false,
                
            // 设置成false,在后台设置值的时候,可以乱序。且并非每个值都得设
            },
            loadonce : true,
            pager : '#gridPager',
            sortable : false,
            caption : "Test-JqGrid-Grid2"
        })
    });
    $("#test").jqGrid('setFrozenColumns');  
</script>
</head>

<body>

    <table id="test"></table>
    <div id="gridPager"></div>
</body>
</html>
加载中
0
太空守望者
太空守望者
请参考jqGrid中文demo:http://blog.mn886.net/jqGrid/ 
返回顶部
顶部