SAPUI5: Как реализовать меню с помощью MultiComboBox - PullRequest
Новая
       27

SAPUI5: Как реализовать меню с помощью MultiComboBox

0 голосов
/ 07 апреля 2020

Я понимаю, что следующее меню: Меню

Я решил использовать это меню: MultiComboBox: 

<MultiComboBox items="{modelExample>/}" >  //Model with a Title and Options
    <core:Item text="{modelExample>option}"/>
</MultiComboBox>

Проблемы

  1. Код демонстрирует все параметры, пока не знаю, как разместить заголовок над параметрами для достижения этого отображения. Что я пробовал: Ссылка - на самом деле не работает

  2. Как добавить новый столбец для MultiComboBox.

  3. Если я хочу добавить новый ListItem с помощью контроллера, он выглядит следующим образом:

    var l = new sap.ui.core.ListItem("ID"); var label = new sap.m.Label(); label.setText("Hallo Welt"); l.addCell(label); //Cell isn't supported -> those Error MultiComboBox.addItem(l);

  4. Cell не поддерживается MultiComboBox в отличие от табл. -> Как я могу добавить ячейку / б / е с заголовком и всеми остальными опциями в ListItem -> чем MultiComboBox.addItem (l)?

РЕДАКТИРОВАТЬ: Модель

1 Ответ

0 голосов
/ 07 апреля 2020

«Плитка» является сортировщиком или, что лучше, «группой» 

<MultiComboBox
    selectionChange="handleSelectionChange"
    selectionFinish="handleSelectionFinish"
    width="500px"
    items="{
        path: '/ProductCollection',
        sorter: {
            path: 'SupplierName',
            descending: false,
            group: true
        },
        groupHeaderFactory: '.getGroupHeader'
    }">
    <core:Item key="{ProductId}" text="{Name}" />
</MultiComboBox>

Например, она объединяет ВСЕ продукты с одинаковым именем поставщика в выпадающем списке. Я не знаю, как выглядит ваша модель, но расширяю ее группой и использую ее на сортировщике

, а в вашем контроллере вам также необходимо упомянуть функцию 

getGroupHeader: function (oGroup) {
        return new SeparatorItem( {
            text: oGroup.key
        });
    }

, например, вашу модель: 

{
    "ProductCollection": [
        {
            "ProductId": "HT-1000",
            "Category": "Laptops",
            "MainCategory": "Computer Systems",
            "TaxTarifCode": "1",
            "SupplierName": "Very Best Screens",
            "WeightMeasure": 4.2,
            "WeightUnit": "KG",
            "Description": "Notebook Basic 15 with 2,80 GHz quad core, 15\" LCD, 4 GB DDR3 RAM, 500 GB Hard Disc, Windows 8 Pro",
            "Name": "Notebook Basic 15",
            "DateOfSale": "2017-03-26",
            "ProductPicUrl": "https://openui5.hana.ondemand.com/test-resources/sap/ui/documentation/sdk/images/HT-1000.jpg",
            "Status": "Available",
            "Quantity": 10,
            "UoM": "PC",
            "CurrencyCode": "EUR",
            "Price": 956,
            "Width": 30,
            "Depth": 18,
            "Height": 3,
            "DimUnit": "cm"
        },
        {
            "ProductId": "HT-1001",
            "Category": "Laptops",
            "MainCategory": "Computer Systems",
            "TaxTarifCode": "1",
            "SupplierName": "Very Best Screens",
            "WeightMeasure": 4.5,
            "WeightUnit": "KG",
            "Description": "Notebook Basic 17 with 2,80 GHz quad core, 17\" LCD, 4 GB DDR3 RAM, 500 GB Hard Disc, Windows 8 Pro",
            "Name": "Notebook Basic 17",
            "DateOfSale": "2017-04-17",
            "ProductPicUrl": "https://openui5.hana.ondemand.com/test-resources/sap/ui/documentation/sdk/images/HT-1001.jpg",
            "Status": "Available",
            "Quantity": 20,
            "UoM": "PC",
            "CurrencyCode": "EUR",
            "Price": 1249,
            "Width": 29,
            "Depth": 17,
            "Height": 3.1,
            "DimUnit": "cm"
        },

вы видите «SupplierName»: «Very Best Screens»

, поэтому, если у вас есть 10 пунктов с «SupplierName»: «Very Best Screens», он будет сгруппирован под «Best Best Screens». Если вы получили 1000 предметов под "tile1", у вас есть плитка 1

...