Hello Readers,
Here I am going to show how to connect an SAPUI5 application to a MySQL database using PHP.
Prerequisites -
Step 1 - Create a database and a table,Insert content.
In my case I am using PHPMyAdmin to create a database (Employee).In it I am creating a table (user) and within it I am inserting some records.
Step 2- Create a SAPUI5 application.
Here,I am creating an SAPUI5 application,wherein I am creating an empty JSON model and calling an ajax function with source to my php file.On the success function,to the JSON model,I set the data recieved from my PHP file.
Afterwards I am showing the data in a table(ui.table.Table), by setting the JSON model.
As this is an basic program,all the code is implemented in the index.html file itself.
My index.html file goes like this :-
Step 3- Write the PHP file
In my PHP file tableData.php, I am writing a query to the database and sending the data to front end in JSON format.
Step 4 - Now execute the index.html -
Thus, we have successfully displayed MySQL table data into an SAPUI5 table.
Here I am going to show how to connect an SAPUI5 application to a MySQL database using PHP.
Prerequisites -
- Install WAMP server / XAMPP server.
- Install PHP.Usually comes in built with the server.
Step 1 - Create a database and a table,Insert content.
In my case I am using PHPMyAdmin to create a database (Employee).In it I am creating a table (user) and within it I am inserting some records.
Step 2- Create a SAPUI5 application.
Here,I am creating an SAPUI5 application,wherein I am creating an empty JSON model and calling an ajax function with source to my php file.On the success function,to the JSON model,I set the data recieved from my PHP file.
Afterwards I am showing the data in a table(ui.table.Table), by setting the JSON model.
As this is an basic program,all the code is implemented in the index.html file itself.
My index.html file goes like this :-
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m,sap.ui.table,sap.ui.commons"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->
<script>
var json = new sap.ui.model.json.JSONModel();
$.ajax({
url: 'tableData.php',
async:false,
success: function(data) //on recieve of reply
{
json.setData(JSON.parse(data));
},
error: function(err)
{
console.log(err);
}
});
var tableo = new sap.ui.table.Table({
title : "Arjun's First Table",
visibleRowCount : 5
});
tableo.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text:"Userid"}),
template : new sap.ui.commons.TextField().bindProperty("value","Userid"),
width : "140px"
}));
tableo.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text:"Name"}),
template : new sap.ui.commons.TextField().bindProperty("value","Name"),
width : "140px"
}));
tableo.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text:"Age"}),
template : new sap.ui.commons.TextField().bindProperty("value","Age"),
width : "140px"
}));
tableo.addColumn(new sap.ui.table.Column({
label : new sap.ui.commons.Label({text:"Email"}),
template : new sap.ui.commons.TextField().bindProperty("value","Email"),
width : "140px"
}));
tableo.setModel(json)
tableo.bindRows("/result");
tableo.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Step 3- Write the PHP file
In my PHP file tableData.php, I am writing a query to the database and sending the data to front end in JSON format.
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "employee";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "select * from user";
$res = mysqli_query($conn,$sql);
$result = array();
while($row = mysqli_fetch_array($res)){
array_push($result,
array('Userid'=>$row[0],'Name'=>$row[1],'Age'=>$row[2],'Email'=>$row[3]));
}
echo json_encode(array('result'=>$result));
?>
Step 4 - Now execute the index.html -
Thus, we have successfully displayed MySQL table data into an SAPUI5 table.
- SAP Managed Tags:
24 Comments
