<div id="divList">    <div class="toolbar">    </div>    <table id="list">    </table>    <div id="pager">    </div></div>

<table id="tableCols" cellpadding="0" cellspacing="0">    <tr>        <td>            <input id="checkAll" type="checkbox" />        </td>        <td class="tdText">            可选显示列：        </td>        <td>            <input type="checkbox" text="发布周期" value="Period" />        </td>        <td class="tdText">            发布周期        </td>        <td>            <input type="checkbox" text="客户执行金额" value="SellAmount" />        </td>        <td class="tdText">            客户执行金额        </td>        <td>            <input type="checkbox" text="开户银行" value="OpenBank" />        </td>        <td class="tdText">            开户银行        </td>        <td>            <input type="checkbox" text="银行账号" value="Account" />        </td>        <td class="tdText">            银行账号        </td>        <td>            <input type="checkbox" text="联系人" value="Linkman" />        </td>        <td class="tdText">            联系人        </td>        <td>            <input type="checkbox" text="电话" value="Phone" />        </td>        <td class="tdText">            电话        </td>    </tr></table>

// 查询方法function search() {    //固定列    var cols = [‘Id‘, ‘SupplierId‘, ‘年份‘, ‘合同编号‘, ‘项目名称‘, ‘供应商名称‘, ‘媒体点位‘, ‘合同时间‘, ‘上画时间‘, ‘合同总金额‘, ‘票据情况‘, ‘票据说明‘, ‘到票时间‘];    var rows = [{ name: ‘Id‘, hidden: true },                { name: ‘SupplierId‘, hidden: true },                { name: ‘Year‘, sortable: false, width: 35, fixed: true },                   { name: ‘ContractNo‘, sortable: false, width: 80, fixed: true, formatter: function (v, o, r) {                       return "<a href=‘javascript:void(0)‘ onclick=‘view(\"" + r["Id"] + "\")‘ > " + v + "</a>";                   }                   },                { name: ‘ProjectName‘, sortable: false, width: 80, fixed: true },                { name: ‘SupplierName‘, sortable: false, width: 80, fixed: true, formatter: function (v, o, r) {                    return "<a href=‘javascript:void(0)‘ onclick=‘viewSupplier(\"" + r["SupplierId"] + "\")‘ > " + v + "</a>";                }                },                { name: ‘Location‘, sortable: false, width: 80, fixed: true, formatter: function (v, o, r) {                    return "<a href=‘javascript:void(0)‘ onclick=‘viewPurchase(\"" + r["Id"] + "\")‘ > " + v + "</a>";                }                },                { name: ‘DispContractStartTime‘, sortable: false, width: 80, fixed: true },                { name: ‘DispDrawingTime‘, sortable: false, width: 80, fixed: true },                { name: ‘SumAmount‘, sortable: false, width: 80, fixed: true, align: "right" },                { name: ‘InvoiceCondition‘, sortable: false, width: 60, fixed: true },                { name: ‘InvoiceDesc‘, sortable: false, width: 80, fixed: true },                { name: ‘ReceiveInvoiceTime‘, sortable: false, width: 80, fixed: true}];    //可选列    $("#tableCols").find("input[text]:checked").each(function () {        var checkbox = $(this);        var colName = checkbox.val();        var text = checkbox.attr("text");        cols.push(text);        rows.push({ name: colName, sortable: false, width: 80, fixed: true });    });    //月份列    cols.push("1月份");    cols.push("2月份");    cols.push("3月份");    cols.push("4月份");    cols.push("5月份");    cols.push("6月份");    cols.push("7月份");    cols.push("8月份");    cols.push("9月份");    cols.push("10月份");    cols.push("11月份");    cols.push("12月份");    rows.push({ name: "NotPay1", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay2", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay3", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay4", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay5", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay6", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay7", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay8", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay9", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay10", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay11", sortable: false, width: 80, fixed: true });    rows.push({ name: "NotPay12", sortable: false, width: 80, fixed: true });    //列表    $("#divList").html(‘<div class="toolbar"></div><table id="list"></table><div id="pager"></div>‘);    $("#list").jqGrid({        url: ‘#{GetSummaryIndexData}‘,        serializeGridData: function (postData) {            return Simpo.ui.jqGrid.serializeGridData(postData);        },        datatype: "json",        colNames: cols,        colModel: rows,        rowNum: 10,        rowList: [10, 20, 30],        pager: ‘#pager‘,        sortable: false,        sortname: ‘Id‘,        sortorder: "desc",        viewrecords: true,        rownumbers: true,        multiselect: true,        height: ‘auto‘,        width: $(".adminMainContent").width(),        loadComplete: function (xhr) {            Simpo.ui.jqGrid.loadComplete("list", xhr);            //遍历数据行,将支付完毕的行颜色锁定            $("#list").find("tr[id]").each(function () {                var tr = $(this);                var noDataCount = 0;                tr.find("td").each(function () {                    var td = $(this);                    if ($.trim(td.html()) == "NoData") {                        noDataCount++;                    }                });                if (noDataCount == 12) {                    tr.find("td").css("background-color", "#e6e6e6");                }            });            //还原显示所有月份列            var titleTable = $("#list").parent().parent().parent().find("table:first");            for (var i = 40; i >= 10; i--) {                var th = titleTable.find("tr").find("th:eq(" + i + ")");                if (th) th.css("display", "");            }            for (var i = 40; i >= 10; i--) {                $("#list").find("tr").each(function () {                    var tr = $(this);                    var td = tr.find("td:eq(" + i + ")");                    if (td) td.css("display", "");                });            }            //隐藏没有数据的月份列            for (var i = 40; i >= 10; i--) {                var del = true;                //遍历数据行的i列                $("#list").find("tr[id]").each(function () {                    var tr = $(this);                    var td = tr.find("td:eq(" + i + ")");                    if (td) {                        if ($.trim(td.html()) != "NoData") {                            del = false;                        }                    }                    else {                        del = false;                    }                });                if (del) {                    //隐藏标题行的i列                    titleTable.find("tr").each(function () {                        var tr = $(this);                        var th = tr.find("th:eq(" + i + ")");                        th.css("display", "none");                    });                    //隐藏数据行的i列                    $("#list").find("tr").each(function () {                        var tr = $(this);                        var td = tr.find("td:eq(" + i + ")");                        td.css("display", "none");                    });                }                //遍历数据行的i列,删除NoData标记                $("#list").find("tr[id]").each(function () {                    var tr = $(this);                    var td = tr.find("td:eq(" + i + ")");                    if (td) {                        if ($.trim(td.html()) == "NoData") {                            td.html("&nbsp;");                        }                    }                });            }        },        onHeaderClick: function () {            Simpo.ui.jqGrid.autoWidth("list"); // 自动宽度        },        loadError: function (xhr, status, error) {            Simpo.ui.jqGrid.loadError("list", xhr, status, error);        }    });    jQuery("#list").jqGrid(‘navGrid‘, ‘#pager‘, { edit: false, add: false, del: false, search: false }).jqGrid(‘sortableRows‘);    var postData = http://www.mamicode.com/Simpo.ui.jqGrid.serializeGridData("list");    jQuery("#list").jqGrid(‘setGridParam‘, { postData: postData, page: 1 }).trigger("reloadGrid");}