Извлечь новые выбранные данные сортировки из диалога P13n

Question

Согласно примеру sap.m.sample.P13nDialog .Модель показывает правильные данные в диалоге персонализации

Но, нажав на ручку OK, я не вижу текущие , но исходные элементы сортировки,products.json модель:

this.oPersonalizationDialog.getPanels()[1].getSortItems()

Как получить текущие выбранные элементы сортировки?

только начальный столбец сортировкивозвращается

console.log(oSortPanel.getAggregation("sortItems")[0]); // ok

второй столбец сортировки установлен в "sortItems"

console.log(oSortPanel.getAggregation("sortItems")[1]); // undefined :/

zip Пример

добавлен код

Page.controller.js

    oPersonalizationDialog: null,
    bShowResetEnabled: false,
    bIsReseted: false,

    handleOK: function(oEvent) {
        //this._storeShowResetEnabled();
        var oSortPanel = oEvent.getSource().getAggregation("panels")[1];
        console.log(oSortPanel);
        var oSortItems = oSortPanel.getAggregation("sortItems")[0];
        console.log(oSortItems);
        var oItemsObject = {
            "ColumnKey": oSortItems.getColumnKey(),
            "Operation": oSortItems.getOperation()
        };
        console.log(oItemsObject);
        console.log(oSortPanel.getAggregation("sortItems")[1]); // undefined

        this.oPersonalizationDialog.close();
    },

    handleCancel: function(oEvent) {
        this.oPersonalizationDialog.close();
    },

    handleReset: function(oEvent) {
        this.bIsReseted = true;
        MessageToast.show("Reset button has been clicked", {
            width: "auto"
        });
    },

    onPersonalizationDialogPress: function(oEvent) {
        var oPersonalizationDialog = this._getDialog();

        oPersonalizationDialog.setShowResetEnabled(this.bShowResetEnabled);
        this.bIsReseted = false;

        oPersonalizationDialog.open();
    },

    onAddColumnsItem: function(oEvent) {
        MessageToast.show("Event 'addColumnsItem' fired in order to move the selected column item", {
            width: "auto"
        });
    },

    onChangeColumnsItem: function(oEvent) {
        MessageToast.show("Event 'changeColumnsItem' fired in order to move the selected column item", {
            width: "auto"
        });
    },

    _storeShowResetEnabled: function() {
        if (this.bIsReseted) {
            this.bShowResetEnabled = false;
        } else {
            this.bShowResetEnabled = this.oPersonalizationDialog.getShowResetEnabled();
        }
    },

    _getDialog: function() {
        if (this.oPersonalizationDialog) {
            return this.oPersonalizationDialog;
        }
        this.oPersonalizationDialog = sap.ui.xmlfragment("sap.m.sample.P13nDialog.PersonalizationDialog", this);

        this.getView().setModel(new JSONModel("products.json"));
        this.getView().setModel(new ResourceModel({
            bundleName: "sap.m.sample.P13nDialog.i18n.i18n"
        }), "i18n");

        this.getView().addDependent(this.oPersonalizationDialog);
        return this.oPersonalizationDialog;
    }

просмотр

<mvc:View height="100%" controllerName="sap.m.sample.P13nDialog.Page"
xmlns:l="sap.ui.layout" xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m">
<l:VerticalLayout
    class="sapUiContentPadding"
    width="100%">
    <l:content>
        <Button
            text="Show Personalization Dialog"
            press="onPersonalizationDialogPress" />
    </l:content>
</l:VerticalLayout>

PersonalizationDialog.fragment.xml.fragment (Диалог)

<core:FragmentDefinition xmlns="sap.m"
xmlns:core="sap.ui.core"
xmlns:app="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1">
<P13nDialog ok="handleOK" cancel="handleCancel" showReset="true"
    reset="handleReset" initialVisiblePanelType="sort">
    <panels>
        <P13nColumnsPanel visible="true" addColumnsItem="onAddColumnsItem"
            changeColumnsItems="onChangeColumnsItem" type="columns"
            items="{
                path: '/ColumnCollection'
            }">
            <items>
                <!-- P13nItem columnKey="name" text="{i18n>ColumnName}" visible="true" 
                    / -->
                <P13nItem columnKey="{path}" text="{text}" visible="{visible}" />
            </items>
        </P13nColumnsPanel>
        <P13nSortPanel visible="false" type="sort"
            containerQuery="true"
            items="{
                path: '/ColumnCollection'
            }"
            sortItems="{
                path: '/SortItems'
            }">
            <P13nItem columnKey="{path}" text="{text}" />
            <sortItems>
                <P13nSortItem columnKey="{columnKeyModel}" operation="{operationModel}" />
            </sortItems>
        </P13nSortPanel>
        <P13nFilterPanel visible="true" type="filter"
            containerQuery="true"
            items="{
                path: '/ColumnCollection'
            }"
            filterItems="{
                path: '/FilterItems'
            }">
            <P13nItem columnKey="{path}" text="{text}" />
            <filterItems>
                <P13nFilterItem columnKey="{columnKeyModel}"
                    operation="{operationModel}" value1="{value1Model}" />
            </filterItems>
        </P13nFilterPanel>
    </panels>
</P13nDialog>

Products.json (Модель)

{
"ColumnCollection":[
    {"text" : "ProductId", "path" : "productId", "visible" : true},
    {"text" : "Name", "path" : "name", "visible" : true},
    {"text" : "Category", "path" : "category"},
    {"text" : "SupplierName", "path" : "supplierName"},
    {"text" : "Description", "path" : "description"},
    {"text" : "WeightMeasure", "path" : "weightMeasure"},
    {"text" : "WeightUnit", "path" : "weightUnit"},
    {"text" : "Price", "path" : "price"},
    {"text" : "CurrencyCode", "path" : "currencyCode"},
    {"text" : "Status", "path" : "status"},
    {"text" : "Quantity", "path" : "quantity"},
    {"text" : "UoM", "path" : "uom"},
    {"text" : "Width", "path" : "width"},
    {"text" : "Depth", "path" : "depth"},
    {"text" : "Height", "path" : "height"},
    {"text" : "DimUnit", "path" : "dimUnit"},
    {"text" : "ProductPicUrl", "path" : "productPicUrl"}
],
"SortItems":[
    {"columnKeyModel" : "name", "operationModel" : "Descending"}
],
"FilterItems":[
    {"columnKeyModel" : "name", "operationModel" : "Contains", "value1Model" : "a"}
]}

Answer 1

этот код проверяет все выбранные элементы сортировки в диалоговом окне p13n. Проверьте мой пример кода ниже:

handleSortPanel: function (oEvent, table) {
        var self = this;
        var oSource = oEvent.getSource();
        var aSorters = [];
        var index = 0;
        oSource.getPanels()[2].getSortItems().forEach(function (sortItem) {
            if (sortItem.getOperation() === "Descending") {
                aSorters.push(new window.sap.ui.model.Sorter(sortItem.getColumnKey(), true));
            }
            if (sortItem.getOperation() === "Ascending") {
                aSorters.push(new window.sap.ui.model.Sorter(sortItem.getColumnKey(), false));
            }
            index += 1;
        });
        if (aSorters.length > 0) {
            self.getView().byId(table).getBinding("items").sort(aSorters);
            aSorters = [];
        }
    }

Этот код возвращает массив с выбранными элементами sortItems.

self.getView().byId(table).getBinding("items").sort(aSorters);

Вы можете связать эту функцию с кнопкой OK диалогового окна p13n и применить фильтр к вашей таблице. Что-то вроде:

onOK: function (oEvent) {
        var oView = this.getView();
        var table = "tableId";

        this.handleSortPanel(oEvent, table);

        oEvent.getSource().close();
        oView.destroyDependents();
    },

РЕДАКТИРОВАТЬ: я узнал, как получить текущие выбранные элементы сортировки. Подход отличается от моего, но, к сожалению, я не знаю почему.

oEvent.getSource().getAggregation("panels")[1].getSortItems()

Изображение SortItems

Получить позицию массива:

oEvent.getSource().getAggregation("panels")[1].getSortItems()[0]

Вы можете применить foreach:

oEvent.getSource().getAggregation("panels")[1].getSortItems().forEach(function (sortItem) { console.log(sortItem.getColumnKey()) });

Answer 2

Привет, вы можете использовать функцию okay, чтобы получить то, что вы хотите, ниже приведен пример, и вы можете улучшить его

handleClose : function(oEvent) {
          var oSortPanel = oEvent.getSource().getAggregation("panels")[1];
          var oSortItems = oSortPanel.getAggregation("sortItems")[0];
          var oItemsObject = {"ColumnKey":oSortItems.getColumnKey(),"Operation":oSortItems.getOperation()};
          alert(JSON.stringify(oItemsObject));
            this.oPersonalizationDialog.close();

        },