爲網格創建一個通用變量以重用每個網格中的配置

Question

我正在使用DevExpress的DevExtreme控件，更具體地說是DxDataGrid。

現在，我每次使用DxDataGrid時間我需要指定這樣的結構：

var grid = $("#myGrid").dxDataGrid({ 
    // These options need to be specified for each DxDataGrid 
    dataSource: { 
     ... 
    }, 
    columns: [ 
     ...     
    ], 
    editing: { 
     ...     
    }, 
    // The following options are always the same for every DxDataGrid 
    columnChooser: { 
     enabled: true 
    }, 
    allowColumnReordering: true, 
    sorting: { 
     mode: 'multiple' 
    }, 
    groupPanel: { 
     visible: true, 
     emptyPanelText: 'Blabla' 
    }, 
    pager: { 
     visible: true, 
     showNavigationButtons: true, 
     showInfo: true, 
     showPageSizeSelector: true, 
     allowedPageSizes: [10, 20, 50, 100] 
    }, 
    paging: { 
     pageSize: 10 
    }, 
    filterRow: { 
     visible: true 
    }, 
    searchPanel: { 
     visible: true, 
     placeholder: 'Buscar' 
    }, 
}).dxDataGrid('instance'); 

我想避免的所有配置參數對於每個DxDataGrid相同的重複代碼。在以下question DevExpress支持成員解釋說：

數據網格配置是一個普通的JavaScript對象。你可以用 創建一個默認網格配置的對象變量，併爲每個網格使用 。使用jQuery.extend（）函數在必要時將新的 選項/屬性添加到默認配置對象。

我不知道如何做到這一點，並沒有可用的代碼示例。任何幫助？

Answer 1

創建包含您共同選擇一個全局變量的外部文件，例如

var commonOptions = { 
    columnChooser: { 
     enabled: true 
    }, 
    allowColumnReordering: true, 
    .... 
}; 

，並在視圖

<script src="~/Scripts/DxDataGridCommonOptions.js"></script> // load the common options into the view 
var viewOptions = { 
    dataSource: { 
    .... // your view specific options 
    }, 
    .... 
}; 
var grid = $("#myGrid").dxDataGrid(
    $.extend(commonOptions, viewOptions) // merge the 2 sets of options 
).dxDataGrid('instance');