видимые проблемы с настройками - макет как один из столбцов в таблице SAP UI5 с текстовым полем и полем со списком

У меня есть следующий xml, который представляет собой древовидную структуру.

<?xml version="1.0" encoding="UTF-8"?>
<Rowsets>
    <Rowset>
        <Row NAME="PH1A" NODE_TYPE="PLANT" DDLSTENABLE="---" ISKPI="false" MNLCNFDDLSTID="NA">
            <Row NAME="LINE1" NODE_TYPE="LINE" DDLSTENABLE="true" ISKPI="true" MNLCNFDDLSTID="1"/>
            <Row NAME="LINE2" NODE_TYPE="LINE" DDLSTENABLE="false" ISKPI="true"MNLCNFDDLSTID="2"/>
        </Row>
        <Row NAME="PN2A" NODE_TYPE="PLANT" DDLSTENABLE="---" ISKPI="false" MNLCNFDDLSTID="NA">
            <Row NAME="UNIT1" NODE_TYPE="LINE" DDLSTENABLE="false" ISKPI="true" MNLCNFDDLSTID="2"/>
        </Row>
        <Row NAME="PN3A" NODE_TYPE="PLANT" DDLSTENABLE="--" ISKPI="false" MNLCNFDDLSTID="NA">
            <Row NAME="UNIT6" NODE_TYPE="LINE" ISKPI="true" MNLCNFDDLSTID="1"/>
        </Row>
    </Rowset>
    <DDLSTS>
        <LST1>
            <Rowset>
                <Row>
                    <MNLCNFDDITMID>1</MNLCNFDDITMID>
                    <MNLCNFDDITMRNK>11</MNLCNFDDITMRNK>
                </Row>
                <Row>
                    <MNLCNFDDITMID>2</MNLCNFDDITMID>
                    <MNLCNFDDITMRNK>12</MNLCNFDDITMRNK>
                </Row>
            </Rowset>
        </LST1>
        <LST2>
            <Rowset>
            <Row>
                    <MNLCNFDDITMID>1</MNLCNFDDITMID>
                    <MNLCNFDDITMRNK>21</MNLCNFDDITMRNK>
                </Row>
                <Row>
                    <MNLCNFDDITMID>2</MNLCNFDDITMID>
                    <MNLCNFDDITMRNK>22</MNLCNFDDITMRNK>
                </Row>
            </Rowset>
        </LST2>
    </DDLSTS>
</Rowsets>

и у меня есть следующая страница sapui5

    <!DOCTYPE html>
<HTML>
  <HEAD>
    <meta http-equiv='X-UA-Compatible' content='IE=edge' />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <script id="sap-ui-bootstrap"
      src="/sapui5/resources/sap-ui-core.js"
      data-sap-ui-theme="sap_goldreflection"
      data-sap-ui-libs="sap.ui.commons,sap.ui.core,sap.ui.ux3,sap.ui.table,sap.m"
      data-sap-ui-compatVersion="edge">
    </script>
<script>
var oMdlAprvlData;

$(document).ready(function (){
    debugger;
  fnLdAprvData();
 });

function fnLdAprvData() {
    $.ajax({
        type: "POST",
        async: true,
        url: "/XMII/Runner",
        dataType: "xml",
        data: {
            "Transaction": "sandbox/MJain/TRX_GETTREE",
            "OutputParameter": "OUTXML",
            "Content-Type": "text/xml"
        },
        success: function (xmlData) {
            oMdlAprvlData = new sap.ui.model.xml.XMLModel(xmlData);
            oTableDataEntry.setModel(oMdlAprvlData);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            sap.ui.commons.MessageBox.show(errorThrown, sap.ui.commons.MessageBox.Icon.ERROR, "Error Message");
        },
        complete: function () {}
    });
}

var oDynamicTFValue = new sap.ui.commons.TextField({
    visible:{
        path: "@DDLSTENABLE",
        type: new sap.ui.model.type.String(),
        formatter : function(DDLSTENABLE) { return !DDLSTENABLE; }
    }
});

var oDynamicCBValue = new sap.ui.commons.ComboBox({
    visible:{
        path: "@DDLSTENABLE",
        type: new sap.ui.model.type.String()
    },
    items: {
        path: "/DDLSTS/0/LST1/0/Rowset/0/Row",
        template: new sap.ui.core.ListItem({
            key: "{MNLCNFDDITMID}",
            text: "{MNLCNFDDITMRNK}"
        })
     }
});
var oDynamicLayoutValue = new sap.ui.layout.HorizontalLayout("layout1",{content: [oDynamicTFValue, oDynamicCBValue ]});

var oTableDataEntry = new sap.ui.table.TreeTable({
    width: "100%",
    height: "100%",
    selectionMode: sap.ui.table.SelectionMode.Single,
    visibleRowCountMode: sap.ui.table.VisibleRowCountMode.Auto,
    selectionBehavior: sap.ui.table.SelectionBehavior.Row,
    expandFirstLevel: true,
    columns: [
        new sap.ui.table.Column({
            label: new sap.ui.commons.Label({
                text: "NAME"
            }),
            template: new sap.ui.commons.TextView({
                text: "{@NAME}"
            })
        }),
        new sap.ui.table.Column({
            label: new sap.ui.commons.Label({
                text: "Value",
            }),
            template: oDynamicLayoutValue
        })
    ]
});
oTableDataEntry.bindRows("/Rowset");
oTableDataEntry.placeAt("content");
</script>
  </HEAD>
  <BODY >    <div id="content"></div>
    <input type="hidden" id="IllumLoginName" value="{IllumLoginName}"> </input>
    <input type="hidden" id="IllumLoginRoles" value="{IllumLoginRoles}"></input>
  </BODY>
</html>
  1. Я определил древовидную таблицу с именем как один из столбцов
  2. Я определил еще одно значение столбца, в качестве шаблона которого используется макет.
  3. Этот макет имеет в качестве содержимого oDynamicTFValue и oDynamicCBValue.
  4. Я показываю текстовое поле или поле со списком на основе значения DDLSTENABLE.
  5. если раскрывающийся список включен, я показываю значения из LST1 (часть xml)

Мои запросы

  1. Как установить для текстового поля и поля со списком значение false, когда ISKPI имеет значение false, и отображать текстовое поле / поле со списком (на основе DDLSTENABLE), где ISKPI истинно

  2. Значения динамического раскрывающегося списка на основе значения MNLCNFDDLSTID ->

Как установить значения раскрывающегося списка на основе значений MNLCNFDDLSTID, например

если MNLCNFDDLSTID = 1, то в раскрывающемся списке ячеек должны отображаться значения из LST1 (то есть - 11,12)

если MNLCNFDDLSTID = 2, то в раскрывающемся списке ячеек должны отображаться значения из LST2 (то есть - 21,22)

  1. Как обновить значение текстового поля значением, выбранным из раскрывающегося списка. (если текстовое поле не отображается, а раскрывающийся список отображается)

Заранее спасибо.


person MRJ    schedule 28.12.2016    source источник


Ответы (2)


Я преобразовал ваши XML-данные в JSON (так как мне удобнее работать с данными JSON).

Ниже представлены ваши данные в формате JSON:

{
    "Rowsets": {
        "Rowset": {
            "Row": [{
                "Row": [{
                    "_NAME": "LINE1",
                    "_NODE_TYPE": "LINE",
                    "_DDLSTENABLE": "true",
                    "_ISKPI": "true",
                    "_MNLCNFDDLSTID": "1"
                }, {
                    "_NAME": "LINE2",
                    "_NODE_TYPE": "LINE",
                    "_DDLSTENABLE": "false",
                    "_ISKPI": "true",
                    "_MNLCNFDDLSTID": "2"
                }],
                "_NAME": "PH1A",
                "_NODE_TYPE": "PLANT",
                "_DDLSTENABLE": "---",
                "_ISKPI": "false",
                "_MNLCNFDDLSTID": "NA"
            }, {
                "Row": {
                    "_NAME": "UNIT1",
                    "_NODE_TYPE": "LINE",
                    "_DDLSTENABLE": "false",
                    "_ISKPI": "true",
                    "_MNLCNFDDLSTID": "2"
                },
                "_NAME": "PN2A",
                "_NODE_TYPE": "PLANT",
                "_DDLSTENABLE": "---",
                "_ISKPI": "false",
                "_MNLCNFDDLSTID": "NA"
            }, {
                "Row": {
                    "_NAME": "UNIT6",
                    "_NODE_TYPE": "LINE",
                    "_ISKPI": "true",
                    "_MNLCNFDDLSTID": "1"
                },
                "_NAME": "PN3A",
                "_NODE_TYPE": "PLANT",
                "_DDLSTENABLE": "--",
                "_ISKPI": "false",
                "_MNLCNFDDLSTID": "NA"
            }]
        },
        "DDLSTS": {
            "LST1": {
                "Rowset": {
                    "Row": [{
                        "MNLCNFDDITMID": "1",
                        "MNLCNFDDITMRNK": "11"
                    }, {
                        "MNLCNFDDITMID": "2",
                        "MNLCNFDDITMRNK": "12"
                    }]
                }
            },
            "LST2": {
                "Rowset": {
                    "Row": [{
                        "MNLCNFDDITMID": "1",
                        "MNLCNFDDITMRNK": "21"
                    }, {
                        "MNLCNFDDITMID": "2",
                        "MNLCNFDDITMRNK": "22"
                    }]
                }
            }
        }
    }
}

Запрос 1: Как установить для текстового поля и поля со списком значение false, если ISKPI имеет значение false, и отображать текстовое поле / поле со списком (на основе DDLSTENABLE), где ISKPI имеет значение true.

Ответ: Судя по вашему комментарию, вы уже это сделали. Ниже приведен код. Привязка видимого свойства отсутствовала для макета.

var oDynamicLayoutValue = new sap.ui.layout.HorizontalLayout("layout1",{
            content: [oDynamicTFValue, oDynamicCBValue ],
            visible:{
                path: "_ISKPI",
                type: new sap.ui.model.type.String()
            }
        });

Запрос 2: значения динамического раскрывающегося списка на основе значения MNLCNFDDLSTID.

Ответ: Для этого нам понадобился динамический путь для элементов ComboBox. Я получил текущий контекст каждого экземпляра горизонтального макета. Таким образом, я могу получить необходимое значение: _MNLCNFDDLSTID для этого конкретного экземпляра горизонтального макета, а затем создать динамический путь на основе значения _MNLCNFDDLSTID. Ниже приведен код:

oDynamicLayoutValue.addEventDelegate({
            onAfterRendering: function () {
                console.log('hey');

                var oCB = this.getContent()[1];
                if (oCB.getVisible()) {
                    if (!this.getBindingContext()) {
                        return;
                    }
                    var oContext = this.getBindingContext().getObject();
                    var path = '/Rowsets/DDLSTS/';
                    if (oContext._MNLCNFDDLSTID === '1') {
                        path = path + "LST1/Rowset/Row/"
                    } else {
                        path = path + "LST2/Rowset/Row/"
                    }

                    oCB.bindAggregation('items',{
                        path:path,
                        template:new sap.ui.core.ListItem({
                            key: "{MNLCNFDDITMID}",
                            text: "{MNLCNFDDITMRNK}"
                        })
                    })
                    console.log('path',path)
                }


            }
        },oDynamicLayoutValue); 

дайте мне знать, если вам нужны дополнительные объяснения.

person Rahul Bhardwaj    schedule 29.12.2016

Сначала введите jsonmodel для ваших наборов строк и используйте данные через привязку. Затем вы можете использовать значения также для:

  1. Вы можете привязать видимый атрибут, например. visible = {ISKPI} (Условное связывание см. https://openui5.hana.ondemand.com/#docs/guide/c98d57347ba444c6945f596584d2db45.html) Поэтому вам нужно активировать сложную привязку:

    data-sap-ui-bindingSyntax = "сложный">

см. https://openui5.hana.ondemand.com/#docs/guide/0c803921b1bf4b3a97a038fbd51ef542.html

  1. Использовать привязку выражения

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

person hackToxa    schedule 28.12.2016
comment
Спасибо за быстрый ответ Pyton. var oDynamicTFValue = new sap.ui.commons.TextField({ visible:{ parts :[ {path : "@DDLSTENABLE"},{path : "@ISKPI"}], type: new sap.ui.model.type.String(), formatter : function(DDLSTENABLE) { return !DDLSTENABLE; } } }); 1. Когда я использую приведенный выше код для установки нескольких путей, я получаю Только CompositeType можно использовать как тип для составных привязок! 2. Я использую простой тип кодирования javascript, а не представление XML. Поэтому я не уверен, что кодировка, которую я сделал, правильная. - person MRJ; 29.12.2016
comment
Я смог решить первую проблему, установив атрибут visible для макета. я даже смог получить выбранное значение раскрывающегося списка в текстовом поле. Теперь осталась только проблема, как динамически настроить раскрывающийся список на основе attirubute. - person MRJ; 29.12.2016
comment
Используйте следующий синтаксис: items = {= $ {MNLCNFDDLSTID} === 1? $ {LST1}: $ {LST2}} - person hackToxa; 29.12.2016
comment
Спасибо @Pyton и Rahul Bhardwaj ... с предложением выше я смог выполнить свои задачи. Еще раз спасибо - person MRJ; 16.01.2017