No data to display – MySQL and PHP

[lpapilloParticipant]

Hi !

I have been following the tutorial “Binding to JSON using PHP” (https://www.jqwidgets.com/angular/angular-grid/#https://www.jqwidgets.com/angular/angular-grid/angular-grid-bindingtojsonusingphp.htm) but I couldn’t manage to display my data (I got the usual “No data to display” message).

The json data is correctly displayed when given as a “localdata” but it doesn’t work when using the “url” source.

It seems that my “data.php” is never executed (my-app/src/sampledata/data.php)

I know this topic has already been treated in many previous posts, but I couldn’t find any solution…

Thank you very much for taking a look at this.

Lea

— app.component.ts (my-app/src/app/app.component.ts) —

import { Component } from ‘@angular/core’;
@Component({
selector: ‘app-root’,
templateUrl: ‘./app.component.html’
})
export class AppComponent {

source: any = {
datatype: ‘json’,
datafields: [
{ name: ‘Nom’, type: ‘string’ },
{ name: ‘Prenom’, type: ‘string’ },
{ name: ‘Adresse’, type: ‘string’ },
{ name: ‘Telephone’, type: ‘int’ }
],
id: ‘id’,

/*data = [
{“Nom”:”Dupont”,”Prenom”:”Thomas”,”Adresse”:”12, Rue de l’arsenal-17300 Rochefort FRANCE”,”Telephone”:”0613374662″},
{“Nom”:”Dubois”,”Prenom”:”Lila”,”Adresse”:”34, Rue de Tolbiac-75013 Paris FRANCE”,”Telephone”:”0778334338″},
{“Nom”:”Barbier”,”Prenom”:”Marcel”,”Adresse”:”3, Rue de Fessenheim-67000 Strasbourg FRANCE”,”Telephone”:”0600239514″},
{“Nom”:”Monette”,”Prenom”:”Julien”,”Adresse”:”4, Rue Dolet-69000 Lyon FRANCE”,”Telephone”:”0789563979″}
];
*/
//localdata: this.data

url: ‘../sampledata/data.php’,
root: “data”,
};

dataAdapter: any = new jqx.dataAdapter(this.source);

columns: any[] = [
{ text: ‘Nom’, datafield: ‘Nom’, width: 200 },
{ text: ‘Prenom’, datafield: ‘Prenom’, width: 200 },
{ text: ‘Adresse’, datafield: ‘Adresse’, width: 250 },
{ text: ‘Telephone’, datafield: ‘Telephone’, width: 200 }
];

getWidth() : any {
if (document.body.offsetWidth < 850) {
return ‘90%’;
}
return 850;
};
}

— data.php (my-app/src/sampledata/data.php) —

<?php
include(‘connect.php’);
$mysqli = new mysqli($hostname $username, $password , $database);
if (mysqli_connect_errno()) {
printf(“Connect failed: %s\n”, mysqli_connect_error());
exit();
}
// get data and store in a json array
$from = 0;
$to = 4;
$query = “SELECT nom, prenom, adresse, telephone FROM client LIMIT ?,?”;
$result = $mysqli->prepare($query);
$result->bind_param(‘ii’, $from, $to);
$result->execute();
$result->bind_result($Nom, $Prenom, $Adresse, $Telephone);
while ($result->fetch()){
$data[] = array(
‘Nom’ => $Nom,
‘Prenom’ => $Prenom,
‘Adresse’ => $Adresse,
‘Telephone’ => $Telephone
);
}

header(“Content-type: application/json”);
echo “{\”data\”:” .json_encode($data). “}”;
$result->close();
$mysqli->close();
?>

[lpapilloParticipant]

Hi,

For those who encounter the same problem, I have been able to load my data by using a wamp server (set “url” to “http://localhost/data.php”).

I have had to allow the Node server to access my Wamp Server by adding “Header set Access-Control-Allow-Origin http://localhost:4200” in the “http.conf” file (don’t forget to activate Apache’s “headers_module”)

The tutorial “Binding to JSON using PHP” doesn’t mention such a CORS mechanism, so I wonder how it works ?

I would be interested in having more information !

Thanks in advance,

Lea

[Author]

Posts