Execute SQL prepared statement in AJAX - php

Question

I can successfully create a graph through Chart.js. The issue is that I would like to generate a graph based on a specific customer's ID. So for example if I were to visit customer http://localhost/test/view_customer?customer_id=21&operation=edit. I would like use the bdi vs. date of customer ID 21 to generate a graph.
I have tried many different solutions, however I have been unsuccessful. I wanted to know if there was anyway to execute an SQL request through AJAX and use that data to generate a graph.
Here is my SQL code that grabs the ID from the URL and generates a string that could be read by chart.js to create a line graph:
<?php
//Gets customer ID from URL
$cid = htmlentities ($_GET['customer_id']);
//query to get data from the table
$sql = sprintf("SELECT treatment_log.bdi, treatment_log.date FROM treatment_log WHERE treatment_fk = ? ORDER BY created_at");
$stmt = mysqli_stmt_init($conn);
mysqli_stmt_prepare($stmt, $sql);
mysqli_stmt_bind_param($stmt, "i", $cid);
mysqli_stmt_execute($stmt);
$data = array();
mysqli_stmt_bind_result($stmt, $bdi, $date);
while(mysqli_stmt_fetch($stmt)) {
$data[] = array('bdi' => $bdi, 'date' => $date);
}
//free memory associated with result
$result->close();
//now print the data
print json_encode($data); ?>
Here is the code I use to generate a line graph:
$(document).ready(function(){
$.ajax({
url: "http://localhost/test/data.php",
method: "GET",
success: function(data) {
console.log(data);
var bdi = [];
var date = [];
for(var i in data) {
date.push( data[i].date);
bdi.push(data[i].bdi);
}
var chartdata = {
labels: date,
datasets : [
{
label: 'BDI',
backgroundColor: 'rgba(239, 243, 255, 0.75)',
borderColor: 'rgba(84, 132, 255, 0.75)',
hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
hoverBorderColor: 'rgba(200, 200, 200, 1)',
data: bdi
}
]
};
var ctx = $("#mycanvas");
var barGraph = new Chart(ctx, {
type: 'line',
data: chartdata,
options: {
responsive: true,
legend: {
position: 'bottom',
},
scales: {
yAxes: [{
ticks: {
fontColor: "rgba(0,0,0,0.5)",
fontStyle: "bold",
beginAtZero: true,
maxTicksLimit: 5,
padding: 20
},
gridLines: {
drawTicks: false,
drawBorder: false,
}
}],
xAxes: [{
gridLines: {
zeroLineColor: "transparent",
display: false
},
ticks: {
padding: 20,
fontColor: "rgba(0,0,0,0.5)",
fontStyle: "bold"
}
}]
},
tooltips: {
backgroundColor: 'rgba(255,255,255)',
titleFontColor: 'rgb(184,189,201)',
bodyFontColor: 'black',
displayColors: false,
borderColor: 'rgb(214,217,225)',
borderWidth: 1,
caretSize: 5,
cornerRadius: 2,
xPadding: 10,
yPadding: 10
}
}
});
},
error: function(data) {
console.log(data);
}
});
});
Currently I am using a URL http://localhost/test/data.php that has a string of data:
[{"bdi":"4","date":"2018-07-11"},{"bdi":"1","date":"2018-07-21"},{"bdi":"5","date":"2018-07-21"},{"bdi":"34","date":"2018-07-21"},{"bdi":"34","date":"2018-07-21"},{"bdi":"3","date":"2018-07-22"},{"bdi":"2","date":"2018-07-23"},{"bdi":"12","date":"2018-07-23"},{"bdi":"3","date":"2018-07-24"},{"bdi":"2","date":"2018-07-25"},{"bdi":"12","date":"2018-07-30"},{"bdi":"3","date":"2018-07-30"},{"bdi":"4","date":"2018-07-30"},{"bdi":"11","date":"2018-07-30"}]
Instead of using a URL to link the data. I want the AJAX to run my SQL code and generate the graph (where the treatment_fk is a variable).
Question:
1. Is it possible to execute an SQL command in AJAX to generate a graph, where the ID is a variable collected from the URL? (How would I do this?)
2. Is there a better way? How would I do that?

Answer 1

Apple one addition parameter to ajax request
$.ajax({
url: "data.php",
data: {
"ChartType": 1/*Or change to drop down selection id*/,
"customer_id":1
},
type: "GET",
success: function(response) {
console.log(response);
},
error: function(xhr) {
}
});
You can see ChartType above, pass its value dynamically for which your want to separate sql query/
Now on server side:
$cid = htmlentities ($_GET['customer_id']);
$cType = htmlentities ($_GET['ChartType']);
if($cType==1)
$sql = sprintf("SELECT treatment_log.bdi, treatment_log.date FROM treatment_log WHERE treatment_fk = ? ORDER BY created_at");
else if($cType==2)
$sql = sprintf("SELECT __ other column name __ WHERE cid=$cid");
else
$sql = sprintf("SELECT __ other column name __ WHERE cid=$cid");
I know this is not complete code, but it will give you idea how to do it.