Dxdatagrid - Multi-Row Headers и средство выбора столбцов не работают должным образом - PullRequest
0 голосов
/ 04 октября 2018

Я хотел бы получить прикрепленный дизайн скриншота, вот мой код

    $scope.userGridOps = {
    allowColumnResizing: true,
    columnAutoWidth: true,
    wordWrapEnabled: false,
    showColumnLines: true,
    showRowLines: true,
    showBorders: true,
    height: '350',
    onInitialized: function (e) {
        $scope.dxGridInstance = e.component;
    },
    filterRow: {
        visible: true,
        applyFilter: "auto"
    },
    headerFilter: {
        visible: true
    },
    bindingOptions: {
        dataSource: "UserList",
        deep: false
    },
    columnChooser: {
        enabled: true,
        emptyPanelText: 'A place to hide the columns'
    },
    sorting: {
        mode: "single"
    },
    scrolling: {
        mode: "virtual"
    },
    onCellPrepared: function (e) {
        if (e.rowType == "header") {
            e.cellElement.addClass('dx-data-grid-header-color-ct');
        }
        if (e.rowType === "data" && e.column.command === "expand") {
            if (e.data.DashBoardTactics.length == 0) {
                e.cellElement.removeClass("dx-datagrid-expand");
                e.cellElement.empty();
            }
        }
    },
    columns: [
        {
            caption: "User Details", alignment: "center",
            columns: [{ dataField: "ID", dataType: "string", caption: "ID", alignment: "left" },
           { dataField: "FirstName", dataType: "string", caption: "First Name", alignment: "left" },
           { dataField: "LastName", dataType: "string", caption: "Last Name", alignment: "left" },
           { dataField: "Address", dataType: "string", caption: "Address", alignment: "left" } 
            ],
        },
        {
            caption: "Company Details", alignment: "center",

            columns: [{
                caption: "External",
                columns: [{ dataField: "Name", dataType: "string", caption: "Name", alignment: "left" }]                 
            },
           {
                caption: "Internal",
                columns: [{ dataField: "Email", dataType: "string", caption: "Email", alignment: "left" }]


            }]
        },
        {
            caption: "Approval Details", alignment: "center",
            columns: [{ dataField: "Date", dataType: "date", caption: "Date", alignment: "left" }
            ],
        } 


    ]
};

введите описание изображения здесь

Кроме того, выбор колонки не работает, когда мультизаголовок строки добавлен.Я пробовал с несколькими подходами, но это не работает должным образом, и я получаю несоответствие выравнивания заголовка.

Просьба помочь исправить проблему выбора дизайна и столбца.

...