Leave invisible input in SAPUI5

0

I'm starting to work with SAPUI5, and I needed to leave an input of an invisible form.

In this screen will have an input for the user to put the login, and next to an input where the name of the user to whom that login belongs will appear. The second input can only appear if you have a login filled in on the first

Follow the code

view / App.view.xml

xmlns="sap.m">
<App>
    <pages>
        <Page title="Aproval">
            <content>
                <IconTabBar id="idTopLevelIconTabBar">
                    <items>

                        <IconTabFilter id="layouts" text="Inicio">

                            <l:Grid defaultSpan="L9 M7 S12" width="auto">
                                <l:content>
                                    <f:SimpleForm id="SimpleFormChange354" minWidth="1024"
                                        maxContainerCols="2" editable="true" layout="ResponsiveGridLayout"
                                        title="aproval" labelSpanL="3" labelSpanM="3"
                                        emptySpanL="4" emptySpanM="4" columnsL="1" columnsM="1"
                                        class="editableForm">
                                        <f:content>



                                            <Label text="Login de" />
                                            <HBox>
                                                <Input value="" id="login" />


                                                <Input value="" id="nome">
                                                </Input>
                                            </HBox>
                                            <Label text="Para" />
                                            <HBox>
                                                <Input value="" id="loginPara" />


                                                <Input value="" id="nomePara">
                                                </Input>
                                            </HBox>
                                            <Label text="Data de" />
                                            <DatePicker dateValue="" placeholder="Insira a data"
                                                id="datade" />


                                            <Label text="Data até" />
                                            <DatePicker dateValue="" placeholder="Insira a data"
                                                id="datapara" />

                                            <Label />
                                            <Button type="Accept" press="submit" text="Submit"></Button>

                                        </f:content>
                                    </f:SimpleForm>
                                </l:content>
                            </l:Grid>
                        </IconTabFilter>
                    </items>
                </IconTabBar>
            </content>
        </Page>
    </pages>
</App>

index.html

                        OpenSAP - Developing Web Apps with SAPUI5

<script id="sap-ui-bootstrap"
    src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m"
    data-sap-ui-compatVersion="edge" data-sap-ui-preload="async"
    data-sap-ui-resourceroots='{    "opensap.myapp": "./"   }'> 
      </script>
<script> 
sap.ui.getCore().attachInit(function () {    sap.ui.xmlview({     viewName: "opensap.myapp.view.App"    }).placeAt("content");   });  </script>
</head>

<body class="sapUiBody" id="content">
</body>
</html>
    
asked by anonymous 24.02.2017 / 18:38

1 answer

1

A bit late, but to those who are useful. You can use the sap.ui.core.control setVisible

p>

In xml it would look like this:

<Input value="" id="login" change:"onChange" />

<Input value="" id="nome" setVisible=false/>    

Note that I created an event handler for the login login, the controller would look like this:

onChange: function(oEvent){
    var login = this.byId("login").getValue();
    if(login){
        this.byId("nome").setVisible(true);
        this.byId("nome").setValue(login);
    }
}
    
30.09.2017 / 18:55