码迷,mamicode.com
首页 > 其他好文 > 详细

jqgrid 分级标题

时间:2016-06-21 15:34:46      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:

参考地址:http://www.trirand.com/jqgridwiki/doku.php?id=wiki:groupingheadar

Grouping of the header should be used after the grid is created. For this purpose we have created a method which is called setGroupHeaders

One typical implementation can look like this

$(document).ready(function(){
    jQuery("#gridTable").jqGrid({
           colNames: [‘Date‘, ‘Client‘, ‘Amount‘, ‘Tax‘, ‘Total‘, ‘Closed‘, ‘Shipped via‘, ‘Notes‘],
           colModel: [
                 {name: ‘invdate‘, index: ‘invdate‘, width: 80, align: ‘center‘, sorttype: ‘date‘,
                    formatter: ‘date‘, formatoptions: {newformat: ‘d-M-Y‘}, datefmt: ‘d-M-Y‘},
                 {name: ‘name‘, index: ‘name‘, width: 70 },
                 {name: ‘amount‘, index: ‘amount‘, width: 75, formatter: ‘number‘, sorttype: ‘number‘, align: ‘right‘},
                 {name: ‘tax‘, index: ‘tax‘, width: 75, formatter: ‘number‘, sorttype: ‘number‘, align: ‘right‘},
                 {name: ‘total‘, index: ‘total‘, width: 75, formatter: ‘number‘, sorttype: ‘number‘, align: ‘right‘},
                 {name: ‘closed‘, index: ‘closed‘, width: 75, align: ‘center‘, formatter: ‘checkbox‘,
                    edittype: ‘checkbox‘, editoptions: {value: ‘Yes:No‘, defaultValue: ‘Yes‘}},
                 {name: ‘ship_via‘, index: ‘ship_via‘, width: 100, align: ‘center‘, formatter: ‘select‘,
                    edittype: ‘select‘, editoptions: {value: ‘FE:FedEx;TN:TNT;IN:Intim‘, defaultValue: ‘Intime‘}},
                 {name: ‘note‘, index: ‘note‘, width: 70, sortable: false}
            ],
            rowNum: 10,
            rowList: [5, 10, 20],
        });
    jQuery("#gridTable").jqGrid(‘setGroupHeaders‘, {
          useColSpanStyle: false, 
          groupHeaders:[
            {startColumnName: ‘amount‘, numberOfColumns: 3, titleText: ‘<em>Price</em>‘},
            {startColumnName: ‘closed‘, numberOfColumns: 2, titleText: ‘Shiping‘}
          ]
        });
    jQuery("#gridTable").jqGrid(‘setGroupHeaders‘, {
          useColSpanStyle: false, 
          groupHeaders:[
            {startColumnName: ‘amount‘, numberOfColumns: 2, titleText: ‘<em>Price22</em>‘},
            {startColumnName: ‘total‘, numberOfColumns: 1, titleText: ‘Shiping2‘},
            {startColumnName: ‘closed‘, numberOfColumns: 2, titleText: ‘Shiping‘}
          ]
        });
});

 

jqgrid 分级标题

标签:

原文地址:http://www.cnblogs.com/newlangwen/p/5603525.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!