Mise en forme d'une page html avec openui5
Bonjour,
Je suis débutant avec le HTML, et j'ai le code suivant qui contient du OpenUI5.
Avec ce code, j'ai une page qui a une ligne pour chaque couple label/input ou label/textarea.
Je voudrais modifier la forme de ma page avec des tableaux pour aider à la lecture.
Par exemple à gauche de la page un tableau avec deux ligne et deux colonnes avec comme données pour la ligne1/col1, le nom du label soit "exemple1" et pour la ligne1/col2 la valeur "c_Exemple1" de l'input. Puis dans la ligne en dessous la même chose mais cette fois ci avec Exemple2.
Et à droite de la page, je voudrais avoir au même niveau, le même type de tableau de gauche mais cette fois ci avec Exemple3 et Exemple4.
Merci d'avance.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
| <!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>Dashboard input</title>
<script id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-libs="sap.ui.commons"></script>
<script id="view1" type="ui5/xmlview">
<mvc:View controllerName="view1.initial"
xmlns="sap.m"
xmlns:core="sap.ui.core"
xmlns:f="sap.ui.layout.form"
xmlns:mvc="sap.ui.core.mvc">
<Shell>
<App>
<Page>
<f:SimpleForm title="TITRE1" editable="true" >
<f:content>
<Label text="Exemple1" textAlign="Left"/>
<Input value="{/c_exemple1}" id="c_exemple1" editable="false" enabled="false" />
<Label text="Exemple2" textAlign="Left"/>
<Input value="{/c_Exemple2}" id="c_Exemple2" editable="false" enabled="false" />
<Label text="Exemple3" textAlign="Left"/>
<TextArea value="{/c_Exemple3}" id="c_Exemple3" showValueHelp="Entre exemple 3" valueLiveUpdate="true" editable="true" enabled="true" design="Bold"/>
<Label text="Exemple3" textAlign="Left"/>
<Input value="{/c_Exemple4}" id="c_Exemple4" editable="false" enabled="false" />
</f:content>
</f:SimpleForm>
<Button id="btn1" type="Accept" text="Update" press="onPress" />
</Page>
</App>
</Shell>
</mvc:View>
</script> |
