如何从对话框中选择的下拉列表中将数据添加到 table 行

Question

我将对话框中的下拉菜单设置为：

    if (!this.pressDialog) {
        this.pressDialog = new Dialog({
  title: "Wafer",
  contentWidth: "40px",
            contentHeight: "300px",
            content: [
    new sap.m.Text({width:'100%', text: 'Component Name' }),

    new sap.m.Select({
    width: '60%', 
    items: [

    new sap.ui.core.Item("item11", {text: "Disregarded"}),

    new sap.ui.core.Item("item12", {text: "Corporation"}),

    new sap.ui.core.Item("item13", {text: "Partnership"})

    ]

    }),

    new sap.m.Text({ width:'100%',text: 'Category' }),
    new sap.m.Select({
      width: '60%',
      items: [

      new sap.ui.core.Item("item1111", {text: "Disregarded"}),

      new sap.ui.core.Item("item1234", {text: "Corporation"}),

      new sap.ui.core.Item("item1314", {text: "Partnership"})

      ]

      }),


          new sap.m.Text({width:'100%', text: 'Quantity' }),
          new sap.m.Select({
            width: '60%',
            items: [

            new sap.ui.core.Item("item15211", {text: "Disregarded"}),

            new sap.ui.core.Item("item136454", {text: "Corporation"}),

            new sap.ui.core.Item("item213754", {text: "Partnership"})

            ]

            }),

        new sap.m.Text({width:'100%', text: 'MainCategory' }),
        new sap.m.Select({
          width: '60%',
          items: [

          new sap.ui.core.Item("item11411", {text: "Disregarded"}),

          new sap.ui.core.Item("item34", {text: "Corporation"}),

          new sap.ui.core.Item("item314", {text: "Partnership"})

          ]

          })],




            beginButton: new Button({
                type: ButtonType.Emphasized,
                text: "OK",
                press: function () {
                    this.pressDialog.close();
                }.bind(this)
            }),
            endButton: new Button({
                text: "Close",
                press: function () {
                    this.pressDialog.close();
                }.bind(this)
            })
        });

        //to get access to the global model
        this.getView().addDependent(this.pressDialog);
    }

它看起来像：

如何从对话框中捕获此处的数据并将其添加到具有与每个项目相同的列的 table，

组件名称，
类别，
数量，
主要类别

我正在尝试如何根据所选下拉列表的值创建 JSON，以便可以绑定到 table

抱歉还有一个问题：how can I center the select boxes 在对话中

任何帮助或指导链接都非常感谢 TIA！

Answer 1

因此，我的理解是您想从 selected 下拉列表 (sap.m.Select) 中创建一个 Json 模型。我们首先创建模型：

let model= {
            "componentName": "Disregarded",
            "category": "Disregarded",
            "quantity": "Disregarded",
            "mainCategory": "Disregarded",
        };
let jsonModel = new JSONModel(model);
this.getView().setModel(jsonSetting, "tableModel");

比起每个 sap.m.Select 我们都有这样的东西（类别示例）：

new sap.m.Select({
                        width: '60%',
                        textAlign: "Center",
                        selectedKey: "{tableModel>/category}",
                        items: [
                 new sap.ui.core.Item("item1111", {text: "Disregarded",key:"Disregarded"}),

                 new sap.ui.core.Item("item1234", {text: "Corporation",key:"Corporation"}),

                 new sap.ui.core.Item("item1314", {text: "Partnership",key:"Partnership"})
                        ]
                    }),

您必须为每个 sap.ui.core.Item 添加密钥，例如所需的文本，而不是指定模型和 selected 项目 selectedKey: "{tableModel>/category}" 之间的动态绑定。当 select 编辑另一个项目时，更改将在模型中可见。

要使 select 框中的文本居中，请使用 textAlign: "Center"，如果要使对话框居中，请使用 sap.m.FlexBox:

new sap.m.FlexBox({
         justifyContent: "Center",
         items:[
              new sap.m.Select({
                    ...
              }),
         ]
}
),

如果 select 框出现换行删除属性 width:60%

现在你已经准备好了模型，你可以用 table 绑定它（我想你想要这个在 OK 按钮的功能中）。

请注意，变量 model 将为每个 sap.m.Select 指定初始 selected 密钥（每个人都设置为忽略）。

如何从对话框中选择的下拉列表中将数据添加到 table 行

how to add data to table row from the dropdown selected in a dialog box

sapui5