如何在頁面上管理多個Slickgrids的事件？

Question

我有一個關於在頁面上使用多個Slickgrids的問題。由於網格的數量動態變化，我創建它們在一個JavaScript函數中，並使用一個網格數組來保存它們，如下所示。

var columns = []; 
var options = []; 
for(var i=0; i<value; i++){ 
    options[i] = { 
    editable: true, 
    enableAddRow: true, 
    enableCellNavigation: true, 
    asyncEditorLoading: true, 
    autoEdit: false, 
    forceFitColumns: false, 
    //fullWidthRows: true, 
    syncColumnCellResize: true, 
    rerenderOnResize: true, 
    topPanelHeight: 30, 
    rowHeight: 22, 
    cellHighlightCssClass: "changed", 
    cellFlashingCssClass: "current-server"}; 
} 
for(var i=0; i<value; i++) { 
    columns[i].push({id: value, name: value, field: value}); 
    columns[i].push({id: value2, name: value2, field: value2}); 
    columns[i].push({id: value3, name: value3, field: value3}); 
} 
var arrayOfGrids = []; 

for(var i=0; i<value; i++) { 
    dataView = new Slick.Data.DataView(); 
    arrayOfGrids.push(new Slick.Grid('#' + i, dataView, columns[i], options[i])); 
    // .... 

但我的問題是我如何管理這些網格的事件，因爲事件應該單獨實施就我而言。即使我的所有網格必須具有相同的事件，但我不知道如何確定觸發哪個網格的事件。

請幫幫我!!!非常感謝您的興趣;）

Answer 1

您是否熟悉Javascript中的閉包概念？如果沒有，你應該谷歌它。

這裏是我認爲他們可以解決你的問題：

1）創建自己的函數來創建/初始化網格

2）在for循環

3調用這個函數）在initGrid函數中訂閱你的事件。通過這種方式，您將始終參考正確的網格。 （看看下面我的代碼中的initGrid函數中的註釋）

function initGrid(index) 
{ 
    var dataView = new Slick.Data.DataView(); 
    var grid = new Slick.Grid('#' + index, dataView, columns[index], options[index]); 
    arrayOfGrids.push(grid); 
    grid.onClick.subscribe(function (e) { 
    //grid variable will always be the clicked gird 
    //index variable will always be the correct one for this grid 
    //columns[index] will always be the columns for the clicked grid 
    //... 
    }); 
} 

for(var i=0; i<value; i++) { 
    initGrid(i); 
    // .... 
}