Mise en forme d'une page html avec openui5

**julbisounours** · 26/03/2020, 15h26

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 HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

**NoSmoking** · 26/03/2020, 18h15

Bonjour,
et quel est le rapport avec JavaScript ?

D'autre part ton code, tel que présenté, est inexploitable, il faut nous mettre le code HTML généré (Ctrl + U).

On verra après à déplacer la discussion dans le bon forum.

**julbisounours** · 01/04/2020, 09h31

bonjour,
pour vous dire que j'ai résolu mon problème en modifiant la partie <f:simpleform> en rajoutant dans cette balise layout="ResponsiveGridLayout" et ces propriétés.

Mise en forme d'une page html avec openui5

JavaScript

Discussions similaires

Partager

Partager