I'm trying to make a feature when I click on smaller picture to open a bigger one and show me some more additional details beside image itself. When the small image is clicked it's firing a function which pulling the id of the picture trough the dataset, and I'm trying send that data to .php file and then load from mysql database but all I get is an error. What am I doing wrong here? Am I doing mistake in js part or php one?
Same thing happens when I try to do it in a jquery version.
Here is vanilla.js version
function modalTitleLoad(e) {
let dataObj = e.target.dataset.id;
let xhr = new XMLHttpRequest();
xhr.open('GET', 'modalTitle.php');
xhr.onload = function () {
if (this.status == 200) {
let data = this.response;
let datapass = dataObj;
let output = '';
output += data;
document.querySelector('.modal__title').innerHTML = output;
}
};
xhr.send();
}
jquery version:
function modalData(e) {
let dataObj = e.target.dataset.id;
$.ajax({
type: 'GET',
url: 'modalTitle.php',
data: {
datapass: dataObj,
},
success: function (data) {
$('.modal__title').append(data);
},
});
}
modalData(event);
and there's the .php file:
<?php
$datapass = $_GET['datapass'];
$conn = mysqli_connect('localhost','root','','db');
$query = mysqli_query($conn, "SELECT description FROM content where timecode={$datapass}");
$data = mysqli_fetch_all($query, MYSQLI_ASSOC);
echo json_encode($data);
and here is the error:
Warning: Undefined array key "datapass" in C:\xampp\htdocs\Project\modalTitle.php on line 3
Fatal error: Uncaught TypeError: mysqli_fetch_all(): Argument #1 ($result) must be of type mysqli_result,
bool given in C:\xampp\htdocs\Project\modalTitle.php:9 Stack trace: #0
C:\xampp\htdocs\Project\modalTitle.php(9): mysqli_fetch_all(false, 1) #1 {main} thrown in
C:\xampp\htdocs\Project\modalTitle.php on line 9