jqGrid getGridParam（＆＃39; colModel＆＃39;）缺少信息

时间：2015-05-15 18:25:03

标签： jqgrid

我希望在页面卸载并将其存储在会话中时捕获我的jqGrid的colModel，以便下次用户进入页面时可以自动加载。但是，（＆＃39;＃contract_grid＆＃39;）。getGridParam（＆＃39; colModel＆＃39;）返回的信息缺少网格列的搜索选项中的部分或全部信息。

知道这是为什么或如何捕获完整的colModel？网格在初始加载时效果很好但没有其他搜索选项参数，当我从会话中存储的colModel刷新页面时，过滤条功能/菜单不起作用。

为网格

创建默认colModel 
var defaultColModel = 
[

    {name:'REQUESTID'
        ,index:'requestID'
        ,label:'Request ID'
        ,search:true
        ,stype:'text'
        ,width:75
        ,key:true
        ,hidden:false
    },  
    {name:'REQUESTEDDATE'
        ,index:'requestedDate'
        ,label:'Request Date'
        ,sorttype:"date"
        ,search:true
        ,width:50
        ,searchoptions:{
            dataInit:function(el){jQuery(el).daterangepicker(
                            {
                            arrows:false
                            , dateFormat:'yy-mm-dd'
                            , onClose: function(dateText, inst){ jQuery("#contract_grid")[0].triggerToolbar();}
                            , onOpen: function() {
                                jQuery('div.ui-daterangepickercontain').css({"top": jQuery('#mouseY').val() + 'px', "left": jQuery('#mouseX').val() + 'px' });
                            }

                        });
                }
            }
        ,hidden:false
    },

    {name:'BUSINESSOWNERPERSONID'
        ,index:'businessOwnerPersonID'
        ,label:'Business Owner'
        ,search:true
        ,stype:'select'
        ,width:100
        ,hidden:false
        ,searchoptions: {
             dataUrl: 'cfc/com_common.cfc?method=getAjxPeople&role=businessOwnerPersonID',
             buildSelect: function(resp) {
                 var sel= '<select><option value=""></option><option value="7583,1636">My Reports</option>';
                 var obj = $.parseJSON(resp);
                 $.each(obj, function() {
                     sel += '<option value="'+this['lk_value']+ '">'+this['lk_option'] + "</option>"; // label and value are returned from Java layer
                 });
                 sel += '</select>';
                 return sel;
             },          
             dataEvents: [{  
                 type: 'change',
                 fn: function(e) {
                     alert(this.value)
                 }
             }]
         }
    }
];

当用户离开页面时，将网格保存到会话中，以便在它们返回时加载

$(window).on('beforeunload', function(){
     takeSnapshot();     
});
function takeSnapshot(){
var gridInfo = new Object();
    gridInfo.colModel = jQuery('#contract_grid').getGridParam('colModel');
    gridInfo.postData = jQuery('#contract_grid').jqGrid('getGridParam', 'postData');
    var snapshotData = JSON.stringify(gridInfo);

 $.ajax({
    url:  "actions/act_filter.cfc?method=takeSnapshot",
    type: "POST",
    async: false,
    data: {gridName:'contract_grid'
            ,gridParamName:'contractGridParams'
            ,filterData:snapshotData

    }
});

}

创建网格变量

var myGrid = jQuery("#contract_grid").jqGrid({
    url:            'cfc/com_ajxRequestNew.cfc?method=getReqJSON&returnformat=json',
    datatype:       'json',
    postData:       {filters: myFilters},
    mtype:          'POST',
    search:         true,
    colModel:       defaultColModel,
    altRows:        true,
    emptyrecords:   'NO CONTRACTS FOUND',
    height:         400,
    width:          1200,
    sortname:       lastSortName,
    sortorder:      lastSortOrder,
    page:           lastPage,
    pager:          jQuery('#report_pager'),
    rowNum:         lastRowNum,
    rowList:        [10,20,50,100],
    viewrecords:    true,
    clearSearch:    false,
    caption:        "Contracts Dashboard",
    sortable:       true,
    shrinkToFit:    false,
    ajaxSelectOptions: {type: "GET"},
    gridComplete: function() {
        //set the selected toolbar filter values
        var myFields = JSON.parse(myFilters);
        //set fields in form at top. filter contains index value so get corresponding name value because its used in the column label #gs
        if ( myFields['rules'].length > 0 ) {
            for (var i=0; i < myFields['rules'].length; i++ ) {
                $.each(defaultColModel, function(j) {
                    if(this.index == myFields['rules'][i]['field'] ) {
                        thisFieldName = this.name;
                        jQuery('#gs_' + thisFieldName).val( myFields['rules'][i]['data'] ); 
                    }
                })
            }
        }
    }
});
jQuery("#contract_grid").navGrid('#report_pager',{
    edit:false,
    add:false,
    del:false,
    search:false,
    refresh:false
}).navButtonAdd("#report_pager",{ caption:"Clear",title:"Clear Filters", buttonicon :'ui-icon-trash',
    onClickButton: function() {
        jQuery.ajax({
          url: "/assets/js/ajx_clearFilter.cfm?showHeader=0",
          async: false,
          type: "POST",
          data: ({variableName:'session.contractGridParams'})
        });
        myGrid[0].clearToolbar();
    }
}).navButtonAdd("#report_pager",{ caption:"Restore",title:"Restore Default Grid Columns and Filters", buttonicon :'ui-icon-refresh',
    onClickButton: function() {
        window.location = '?page=dsp_requestListingNew&clearSession=1';
    }
}).navButtonAdd("#report_pager",{
        caption:    "Export",
        title:      "Export to Excel",
        buttonicon :'ui-icon-document',
        onClickButton: function(e){
            jQuery("#contract_grid").jqGrid('excelExport',{url:'includes/act_requestListingExport.cfm'});
        }
}).navButtonAdd("#report_pager",{
    caption: "Columns",
    buttonicon: "ui-icon-calculator",
    title: "Select and Reorder Columns",
    jqModal: true,
    onClickButton: function(e){

        $('#contract_grid').jqGrid('columnChooser', {
            dialog_opts: {
                modal: true,
                minWidth: 470,
                show: 'blind',
                hide: 'explode'
            }
        }); 
    }

}).navButtonAdd("#report_pager",{
    caption:    "Save",
    title:      "Save Snapshot",
    buttonicon :'ui-icon-disk',
    onClickButton: function(e){
        takeSnapshot(0);
        $('#fltrFrmLink').click();
    }
});
jQuery("#contract_grid").jqGrid('filterToolbar', {
    stringResult : true
    , searchOnEnter : true
    , autoSearch : true
    , beforeClear : function() {
        //set sortnames
        var sn = jQuery("#contract_grid").jqGrid('getGridParam','sortname');
        //set sort orders
        var so = jQuery("#contract_grid").jqGrid('getGridParam','sortorder');
        so = "desc";
        //set grid params
        jQuery("#contract_grid").jqGrid('setGridParam',{ sortorder:so, sortname:sn });

    }
});

在卸载时由＃＆＃39;＃contract_grid＆＃39;。getGridParam（＆＃39; colModel＆＃39;）返回的colModel。 searchoptions缺少REQUESTEDDATE的所有内容。 BUSINESSOWNERPERSONID缺少部分dataEvents和所有buildSelect。 

[{"name":"REQUESTID",
"index":"requestID",
"label":"Request ID",
"search":true,
"stype":"text",
"width":75,
"key":true,
"hidden":false,
"title":true,"lso":"",
"widthOrg":75,"resizable":true,"sortable":true},
{"name":"REQUESTEDDATE",
"index":"requestedDate",
"label":"Request Date",
"sorttype":"date",
"search":true,
"width":50,
"searchoptions:{},
"hidden":false,
"title":true,
"lso":"",
"widthOrg":50,
"resizable":true,
"sortable":true,"stype":"text"},
{"name":"BUSINESSOWNERPERSONID",
"index":"businessOwnerPersonID",
"label":"Business Owner",
"search":true,
"stype":"select",
"width":100,"hidden":false,
"searchoptions":{"dataUrl":"cfc/com_common.cfc?method=getAjxPeople&role=businessOwnerPersonID",
    "dataEvents":[{"type":"change"}]},
"title":true,
"lso":"",
"widthOrg":100,
"resizable":true,
"sortable":true}]

1 个答案:

答案 0 :(得分：0)

JSON不支持功能的序列化。因此，使用searchoptions.dataInit后，searchoptions.buildSelect，colModel以及您在JSON.stringify中使用的所有其他功能都将被丢弃。

了解您使用的jqGrid / free jqGrid或Guriddo jqGrid JS的版本非常重要。从jqGrid 4.7开始，可以在template中使用colModel值定义string（请参阅the pull request）。您将获得colModel中可以使用JSON.stringify序列化的主要信息。

相关问题
最新问题