Question

我已成功加载网格中的数据。我已启用单元格编辑，单击一个单元格，它将处于编辑模式，可以编辑多个单元格。编辑后的数据将在以后单击自定义更新按钮时存储。在单击另一个自定义按钮时，新行将添加到网格中，并且还将在单击前面提到的更新按钮时保存。

现在的问题是当我尝试重置编辑的值（即编辑的单元格值和保存前添加的新行）时，使用“重新加载”功能在网格中没有任何反应。它与编辑的值保持一致和空的新行...

我的代码在这里

$scope.init = function() {
        var grid = $("#list");
        var lastSel, dataSel, dataLen;
        var colD, colM, colN, userdata;
        jQuery.ajax({
        async: false,
            type: "GET",
            url:"getData.htm",
            data: "",
            dataType: "json",          
            success: function(result){
                colD = result.colData, 
                colM = result.colModel, 
                colN = result.colNames, 
                userdata = colD.userdata; 
                jQuery("#list").jqGrid({
                    datatype: 'local',
                    data: colD.rootVar,   
                    colModel:colM,

                    sortorder: 'asc',
                    viewrecords: true,
                    resizable: true,
                    gridview: true,                
                    altRows: true,                                  
                    cellEdit:true,
                    footerrow: true,                    
                    scrollbar: true,
                    overflow: scroll,   
                    scrollrows: true,

                    loadonce:true,  

                    autowidth: true,
                    shrinkToFit: false, 

                    editurl: 'clientArray',
                    cellsubmit: 'clientArray', 

                    afterEditCell: function (id,name,val,iRow,iCol){ 

                    },                  
                    afterSaveCell : function(rowid,name,val,iRow,iCol) { 
                         var updtd = jQuery("#list").jqGrid('getCol', name, false, 'sum'); 
                         var objs = [];
                         objs[name] = updtd;
                         jQuery("#list").jqGrid('footerData','set',objs);
                    },                

                    loadComplete: function(data){  
                        jQuery("#list").jqGrid('footerData','set',{'Employer':'Max Guest Count:'});
                        var colnames = jQuery("#list").jqGrid ('getGridParam', 'colModel'); 

                        dataLen = colnames.length;  
                        dataSel = colnames[3]['name'];                  

                        for (var i = 3; i < colnames.length; i++){                      
                            var tot = jQuery("#list").jqGrid('getCol', colnames[i]['name'], false, 'sum');                            
                            var ob = [];
                            ob[colnames[i]['name']] = tot;
                            jQuery("#list").jqGrid('footerData','set',ob);
                        }

                        var ids = grid.getDataIDs();
                        for (var i = 0; i < ids.length; i++) {
                            grid.setRowData ( ids[i], false, {height: 25} );
                        }

                        jQuery ("table.ui-jqgrid-htable", jQuery("#list")).css ("height", 30);                 
                    },                

                    gridComplete: function () {
                            jQuery("#list").jqGrid('setColProp','id',{width:20});
                            jQuery("#list").jqGrid('setColProp','Employer',{width:80});
                            jQuery("#list").jqGrid('setColProp','Sponsor',{width:80});

                            var tabs = $("#tabs");
                            var width = tabs.width();
                            jQuery("#list").jqGrid('setGridWidth', width - 80, true);
                            jQuery("#list").jqGrid('setGridHeight', 270);
                     },         
                });   
            },         
        }); 

        jQuery("#list").jqGrid('setGroupHeaders', {
              useColSpanStyle: true, 
              groupHeaders:[
                {startColumnName: 'id', numberOfColumns: 1, titleText: ''},
                {startColumnName: 'Employer', numberOfColumns: 2, titleText: ''},
                {startColumnName: dataSel, numberOfColumns: dataLen, titleText: '<Strong><font color="white">Here Comes</font></Strong>'}
              ] 
        }); 

        $("#addtn").click(function(){
            var newRowData = {"Id":"","Employer":"","Sponsor":"",col1:"",col2:"",col3:"",col4:"",col5:"",col6:"",col7:"",col8:"",col9:"",col10:"",col11:"",col12:"",col13:"",col14:"",col15:"",col16:"",col17:"",col18:"",col19:"",col20:""};
            jQuery("#list").addRowData(0,newRowData,"first",1);             
            jQuery("#list").editRow(0,true);            
        });

        $("#rstbtn").click(function(){
            $("#list").jqGrid('setGridParam',{datatype:'json', page:1, current:true}).trigger('reloadGrid')
       });          
    };  

I will really appreciate if someone can advice on this..

Answer 1

可能是因为这行：jqgrid定义中的loadonce:true,。将其设置为false，然后重试。

要重新加载，请尝试以下代码：

 $( '#list' ).trigger( 'reloadGrid', [{ page: 1}] );

Answer 2

下面的代码为我工作，从数组中加载更新的数据。

$('#grid').jqGrid('clearGridData');
$("#grid").jqGrid('setGridParam',{data: DataArr, datatype:'local'}).trigger('reloadGrid');

按钮单击时重新加载JQgrid中的数据不起作用

2 个答案: