Make input invisible in SAPUI5

Asked

Viewed 86 times

0

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

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

Follows 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>

1 answer

1


A little late, but to whom it is useful. You can use the setVisible of sap.ui.core.control

https://sapui5.hana.ondemand.com/1.36.13/docs/api/symbols/sap.ui.core.Control.html#setVisible

In xml would look like this:

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

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

Note that I created an event handler for input 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);
    }
}

Browser other questions tagged

You are not signed in. Login or sign up in order to post.