2012-05-23 74 views
0

我有一個多選的Jqgrid。最初從服務器加載帶有Json響應的網格時,多選行在我從一個頁面導航到另一個頁面時保持正確。Jqgrid - 觸發JqGrid重新加載後多個分離的行不再存在

所選行的ID存儲在數組中,並且此數組在分頁時更新。我使用這個數組來檢查返回到頁面的已經選擇的行。排序工作正常,我目前沒有遇到任何問題。

在特定字段上應用過濾器時,會向服務器發送一個請求,該請求會在Json中返回新的過濾結果,然後使用它重新加載網格。

第一頁呈現正確,選中的行已選中,但更改頁面並返回行不再被選中。但是數組仍然包含ID並且還包含新添加的ID。

多重選擇功能在重新加載後如何停止工作?或者它甚至不是因爲重裝?

下面是代碼:

 <script type='text/javascript'> 
var selectedFieldsMap={}; 
var selectedFieldsObjs = []; 
var selectedFieldIds = []; 
$(function() { 
    //function called when applying a filter 
    $('#ApplyFilterBtn').click(function() { 
      saveGridState(); 
     $('#Grid').setGridParam({ url: getUrl() }); 
     $('#Grid').trigger('reloadGrid'); 
    }); 
}); 

function saveGridState() { 
     var selectedIds = $('#Grid').getGridParam('selarrrow'); 
     $('#Grid').data(current_page, selectedIds); 
     _.each(selectedIds, function(id) { 
       selectedFieldIds.push(id); 
      }); 
     var idsToBeAdded = _.difference(selectedIds, getExistingRowIdsForGrid('#list')); 
     selectedFieldsMap[current_page] = idsToBeAdded; 
     _.each(idsToBeAdded, function(id) { 
     selectedFieldsObjs.push($('#Grid').getRowData(id)); 
        }); 
} 

function getExistingRowIdsForGrid(gridSelector) { 
var existingFields = $(gridSelector).getRowData(); 
return _.map(existingFields, function(obj) { return obj.Id; });  

function resetFilterValuesAndReloadGrid() { 
    //reset filters and set grid param 
    $('#Grid').setGridParam({ 
     sortname: 'Id', 
     sortorder: 'asc', 
     page: 1, 
     url: getUrl() 
    }); 
    $('#Grid').jqGrid('sortGrid', 'Id', true); 
    $("#Grid").trigger('reloadGrid'); 
} 

    $("#Grid").jqGrid({ 
     url: getUrl(), 
     datatype: "json", 
     edit: false, 
     add: false, 
     del: false, 
     height: 330, 
     mtype: 'GET', 
     colNames: ['Id', 'Type', 'Category'], 
     jsonReader: { 
      root: "DataRoot", 
      page: "CurrentPage", 
      total: "TotalPages", 
      records: "TotalRecords", 
      repeatitems: false, 
      cell: "", 
      id: "0" 
     }, 
     colModel: [ 
      { name: 'Id', index: 'Id', width: 95, align: 'center', sorttype: "int" }, 
      { name: 'Type', index: 'ValueTypeName', width: 110, align: 'left',sortable: true }, 
      { name: 'Category', index: 'Category', width: 72, align: 'left', sortable: true }, 
     ], 

     pager: '#pager', 
     rowNum: pageCount[0], 
     rowList: pageCount, 
     sortname: 'Id', 
     sortorder: 'asc', 
     viewrecords: true, 
     gridview: true, 
     multiselect: true, 

     loadComplete: function() { 
      if(selectedFieldIds) { 
     $.each(_.uniq(selectedFieldIds), function(index, value) { 
        $('#Grid').setSelection(value, true); 
       }); 
      } 
     } , 

     onPaging : function() { 
      saveGridState(); 
     }, 

     loadBeforeSend: function() { 
      current_page = $(this).getGridParam('page').toString(); 

     } , 
     onSortCol: function() { 
      saveGridState(); 
     } 
    }); 

} 

function getUrl() { 
//return url with the parameters and filtering 
} 
</script> 
+0

你可以發佈你的任何代碼,以顯示你在做什麼? –

+0

嘿@JustinEthier對不起,回覆晚了。我用代碼更新了這個問題.. –

+0

不用擔心,很高興你找到了解決方案。 –

回答

1

問題是解決了,是對電網,檢查該行的函數被調用,因爲它是在的document.ready(重新加載會發生什麼)和上網格loadComplete調用相同的函數。切換髮生,選擇被刪除。我添加了if條件來查看網格是否被選中。

loadComplete: function() { 
      var selRowIds = jQuery('#Grid').jqGrid('getGridParam', 'selarrrow'); 
      if (selRowIds.length > 0) { 
       return false; 
      } else { 
       var $this = $(this), i, count; 
       for (i = 0, count = idsOfSelectedRows.length; i < count; i++) { 
        $this.jqGrid('setSelection', idsOfSelectedRows[i], false); 
      } 
      } 
     } 
+0

+1,很高興你能解決你的問題!如果有機會,請將此標記爲已接受的答案(您可能需要等待一天),所以其他人都知道您有修正。 –

+0

@Justin謝謝賈斯汀。 –