No Data to display – PHP – MySQL – jqxgrid return empty source

[ifahdParticipant]

this is my code.

//jqxtest.php

<?php
#Include the connect.php file
$hostname = “localhost”;
$database = “technique”;
$username = “root”;
$password = “”;

// Connect to the database

$mysqli = new mysqli($hostname, $username, $password, $database);

/* check connection */
if (mysqli_connect_errno())
{
printf(“Connect failed: %s\n”, mysqli_connect_error());
exit();
}
// get data and store in a json array
$query = “SELECT a.idPf, a.designation designation ,a.reference reference, a.nb_s_boite, a.id_g, a.idPsf idPsfPF, b.idPsf idPsfMP, b.designation composition ,b.reference refm, b.description, b.couleur, b.odeur, b.gout
FROM produit_finiAS a INNER JOIN produit_semi_fini AS b ON a.idPsf = b.idPsf
WHERE a.id_g= 6 “;

$requette=mysqli_query($mysqli, $query);
if (!$requette) {
die(‘Requête invalide : ‘ . mysql_error());
}

$result = $mysqli->prepare($query);
$result->execute();
$result->bind_result($idPf, $designation, $reference, $nb_s_boite, $id_g, $idPsfPF, $idPsfMP, $composition, $refm, $description, $couleur, $odeur, $gout);

while ($result->fetch()) {

$ficheTech[] = array(

‘designation’ => $designation,
‘reference’ => $reference,
‘nb_s_boite’ => $nb_s_boite,
‘composition’ => $composition,
‘refm’ => $refm,
‘description’ => $description,
‘couleur’ => $couleur,
‘odeur’ => $odeur,
‘gout’ => $gout,
);
}

for ($i=0; $i < count($ficheTech) ; $i++) {

echo “

";
echo  json_encode($ficheTech[$i], JSON_PRETTY_PRINT); echo "</br>";
echo "

“;

$result->close();

$mysqli->close();
}

?>

//testIndex.php

<link rel=”stylesheet” href=”plugins/jqwidgets-ver6.2.0/jqwidgets/styles/jqx.classic.css” type=”text/css” />
<link rel=”stylesheet” href=”plugins/jqwidgets-ver6.2.0/jqwidgets/styles/jqx.base.css” type=”text/css” />
<script src=”plugins/jquery3.3.1/jquery-3.3.1.min.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxdata.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxmenu.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxlistbox.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxdropdownlist.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.selection.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.columnsresize.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.filter.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.sort.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.pager.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxgrid.grouping.js”></script>
<script type=”text/javascript” src=”plugins/jqwidgets-ver6.2.0/jqwidgets/jqxdatatable.js”></script>

<div id=”jqxGrid”></div>

<script type=”text/javascript”>
$(document).ready(function () {
// prepare the data
var url = “jqxtest.php”;
var source =
{
datatype: “json”,
datafields: [{
name: ‘designation’
}, {
name: ‘reference’
}, {
name: ‘nb_s_boite’
}, {
name: ‘composition’
}, {
name: ‘refm’
}, {
name: ‘description’
}, {
name: ‘couleur’
},
{
name: ‘odeur’
}, {
name: ‘gout’
}],
url: url,

};
console.log(source);

var dataAdapter = new $.jqx.dataAdapter(source);
var theme = “”;

$(“#jqxGrid”).jqxGrid({
source: dataAdapter,
width: “95%”,
height:”100%”,
columnsResize: true,
columns: [{ text: “Désignation”, datafield: ‘designation’, width: ‘20%’ },
{ text: “Référence”, datafield: ‘reference’, width: ‘20%’ },
{ text: “Nb.de s/boite”, datafield: ‘nb_s_boite’, width: ‘20%’ },
{ text: “Composition”, datafield: ‘composition’, width: ‘20%’ },
{ text: “Réf MP”, datafield: ‘refm’, width: ‘20%’ },
{ text: “Description”, datafield: ‘description’, width: ‘20%’ },
{ text: “Couleur”, datafield: ‘couleur’, width: ‘20%’ },
{ text: “Odeur”, datafield: ‘odeur’, width: ‘20%’ },
{ text: “Gout”, datafield: ‘gout’, width: ‘20%’ }
]
});

});

</script>

////////////////////

the request looks fine (jqxtest.php )cause i have a result like this :

{
“designation”: “FLEUR DE JASMINE JAUNE 58”,
“reference”: “VIA-VR01”,
“nb_s_boite”: “1 SAC DE 1Kg”,
“composition”: “JASMINE “,
“refm”: “MPF00”,
“description”: “fleur de jasmin entieres “,
“couleur”: “jaune “,
“odeur”: “jasmine “,
“gout”: “jasmine ”
}

but when i call it in the testIndex.php there is nothing to display, the table is empty.
please there is someone could help to solve this problem ?

[HristoParticipant]

Hello ifahd,

I tested this example and it seems to work fine.
It looks like the issue becomes from the server.
Is there any error message in the console?

I would like to suggest you look at this tutorial, it could be useful.
Also, you could implement the loadError callback of the jqxDataAdapter to check is there any error message.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[ifahdParticipant]

Hi Hristo,

thanks for your reply.
i implemeted the loaderror as you told me, and it shows that the error was in fetching server data.

“error Occured while fetching server data – , parsererror, SyntaxError: Unexpected token < in JSON at position 0”

i dont know how to solve it ..YET.
if you have any advices that could help me, i’ll be greatful.

Kind Regards.

[HristoParticipant]

Hello ifahd,

Please, check your environment is prepared to read JSON PHP files.
Also, you could check your JSON data.
I would like to suggest you look at this topic, too.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[Author]

Posts