Создайте общую переменную для сетки, чтобы повторно использовать конфигурацию в каждой сетке.

Question

Я использую элементы управления DevExtreme от DevExpress, а точнее 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');