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
| <!DOCTYPE html>
<html><head>
<meta name="description" content="UI5 table example with local JSON model" />
<meta http-equiv='X-UA-Compatible' content='IE=edge' />
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script id="sap-ui-bootstrap" src="scripts/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-libs="sap.ui.commons,sap.ui.table"></script>
<script>
// create the DataTable control
var oTable = new sap.ui.table.Table({editable:false});
// define the Table columns
var oControl = new sap.ui.commons.TextView({text:"{nom_contact}"}); // short binding notation
oTable.addColumn(new sap.ui.table.Column({label: new sap.ui.commons.Label({text: "Nom"}), template: oControl, sortProperty: "nom_contact", filterProperty: "nom_contact", width: "100px"}));
oControl = new sap.ui.commons.TextView({text:"{prenom_contact}"}); // more verbose binding notationt
oTable.addColumn(new sap.ui.table.Column({label: new sap.ui.commons.Label({text: "Prénom"}), template: oControl, sortProperty: "prenom_contact", filterProperty: "prenom_contact", width: "100px"}));
// create a JSONModel, fill in the data and bind the Table to this model
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData("datacontacts.php");
oTable.setModel(oModel);
oTable.bindRows("/modelData");
// finally place the Table into the UI
oTable.placeAt("contacts");
</script>
</head>
<body class='sapUiBody'>
<div id='contacts'></div>
</body>
</html> |