jqGrid分组

最新推荐文章于 2019-05-28 07:22:41 发布

weixin_30655219

最新推荐文章于 2019-05-28 07:22:41 发布

阅读量74

点赞数

文章标签： javascript ui ViewUI

原文链接：http://www.cnblogs.com/sho560/p/9177517.html

版权

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="UTF-8">  
        <title></title>  
        <link rel="stylesheet" href="../css/ui.jqgrid-bootstrap-ui.css" />  
        <link rel="stylesheet" href="../css/ui.jqgrid-bootstrap.css" />  
        <link rel="stylesheet" href="../css/ui.jqgrid.css" />  
        <script src="../js/jquery-1.11.0.min.js"></script>  
        <script src="../js/jquery.jqGrid.min.js"></script>  
        <script src="../js/i18n/grid.locale-cn.js"></script>  
        <script>  
            $(function(){  
                 var mydata = [  
                    {id:"1",name:"1号"},  
                    {id:"2",name:"2号"},  
                    {id:"3",name:"3号"},  
                    {id:"4",name:"1号"},  
                    {id:"5",name:"2号"},  
                    {id:"6",name:"3号"},  
                    {id:"7",name:"1号"},  
                    {id:"8",name:"2号"},  
                    {id:"9",name:"3号"}  
                  ];  
                  
                jQuery("#column").jqGrid({  
                    data: mydata,  
                    datatype: "local",  
                    height: 'auto',  
                    rowNum: 30,  
                    rowList: [10,20,30],  
                    colNames:['编号','名称'],  
                    colModel:[  
                        {name:'id',index:'id', width:300, sorttype:"int"},  
                        {name:'name',index:'name', width:900,editable:true}  
                    ],  
                    pager: "#columnPager",  
                    viewrecords: true,  
                    sortname: 'name',  
                    grouping:true,  
                    groupingView : {  
                        groupField : ['name']  
                    },  
                    caption: "分组"  
                });  
            });  
        </script>  
    </head>  
    <body>  
        <div>  
            <table id="column"></table>  
            <div id="columnPager"></div>  
        </div>  
    </body>  
</html>

转载于:https://www.cnblogs.com/sho560/p/9177517.html

weixin_30655219

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jqGrid分组

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="../css/ui.jqgrid-b...
复制链接

扫一扫