syncfusion ej grid пользовательская сводная строка неправильно выровненный заголовок группы - PullRequest
0 голосов
/ 08 октября 2018

У меня есть ejgrid, который работает хорошо, пользовательская сводка хороша, за исключением того, что заголовок заголовка смещен.Я перепробовал все возможные способы манипулирования им, но все равно запутался при первой загрузке, но если я "запустил" (кнопка запуска обновляет сетку и вызывает grid.refreshcontent ()), заголовок отображается правильно.

jQuery("#MyGrid").ejGrid({
            locale: "de-Local",
            columns: cols,
            allowSelection: true,
            enableAltRow: false,
            enableRowHover: true,
            isResponsive: true,
            allowSearching: true,
            selectionSettings: { selectionMode: ["row"] },
            allowFiltering: true,
            allowSorting: true,
            allowScrolling: true,
            allowPaging: true,
            showColumnChooser: true,
            allowGrouping: true,
            pageSettings: { pageSize: 50, pageSizeList: [5, 10, 30, 50, 100] },

            groupSettings: {
                enableDropAreaAnimation: false,
                showGroupSummaryWhenCollapsed: true,
                captionFormat: "{{:key}}"
            },
            filterSettings: {
                filterType: "FilterBar",
                showFilterBarStatus: false,
                showPredicate: true
            },
            summaryRows: [{
                summaryColumns: [
                    {
                        summaryType: ej.Grid.SummaryType.Minimum,
                        displayColumn: "Col0",
                        dataMember: "opening",
                        template: "#groupCaption",
                        format: "{0:N2}"
                    },

                    {
                        summaryType: ej.Grid.SummaryType.Maximum,
                        displayColumn: "Col1",
                        dataMember: "Id",
                        template: "#groupCaption"


                    },
                    {
                        summaryType: ej.Grid.SummaryType.Maximum,
                        displayColumn: "Col2",
                        dataMember: "Id",
                        template: "#groupCaption"


                    },
                    {
                        summaryType: ej.Grid.SummaryType.Custom,
                        displayColumn: "Col3",
                        dataMember: "opening",
                        format: "{0:N2}",

                        customSummaryValue: $scope.getCustomSummaryValue

                    }
                ],

                showTotalSummary: false,
                showCaptionSummary: true
            }],
            showSummary: true,

            rowSelected: function (row) {

            ............
            },
            queryCellInfo: function (args) {

              .............

            },
            actionBegin: $scope.beginOpenGrid,
            actionComplete: $scope.actionComplete,
            create: $scope.gridCreate,
            dataBound: $scope.dataBound
        });



$scope.getCustomSummaryValue = function (col, data) {

        var min, value;
---------some codes here-------------
        return value + min;

    };

Я применяю группировки следующим образом (настройки сетки сохраняются в БД) // gridObj.model.groupSettings.groupedColumns = obj.groupedCol;- это из db

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

$scope.somemethod= function (gridObj) {

        if (gridObj.model.summaryRows[0].summaryColumns.length !== 0) {
            for (var i = 0; i < gridObj.model.summaryRows[0].summaryColumns.length; i++) {
                var x = gridObj.model.summaryRows[0].summaryColumns[i];
                if (x.summaryType === "custom") {
                    if (x.dataMember === "opening") {
                        x.customSummaryValue = $scope.getCustomSummaryValue
                    }
                }
            }
        }

        $scope.setDatasource(gridObj);
    };

затем я манипулирую надписью в моем скрипте cshtml:

<script id="groupCaption" type="text/x-jsrender">
    <span>{{:~caption(#data)}}</span>
</script>

 $.views.helpers({


        caption: function (data) {

            if (data.summaryColumn !== undefined) {
                if (data.summaryColumn.displayColumn === "Col1") {
                    return "Open";
                }
                else if (data.summaryColumn.displayColumn === "Col0") {
                    return data.summaryValue;
                }
                else if (data.summaryColumn.displayColumn === "Col2") {
                    return "Close";
                }


            }
            else if (data.field === "SomeOtherCol") {
                return data.key;
            }


        },


    });

Моя проблема: 1. Заголовок смещается при первой загрузке - как я могу предотвратить это?enter image description here

Кажется, ширина каждого столбца была установлена ​​равной (все они равны 200 пикселям), в отличие от выравнивания, оно соответствует тому, что было установлено в коде сетки ej.

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

...