Why can't ajax get my php file when I move the file into a folder?

Currently I have an index.php page that looks like this:

This is my code:

index.php:

<div style="width: 90%; margin:0 auto;">
<form class="mb-3" style="width: 150px;">
<label for="floor">Floor:</label>
<select class="form-select" name="floor" id="floorSelect" onkeyup="filterByFLoor()">
<option value="" selected>All Floors</option>
<?php
$sql = "SELECT * FROM d_floor";
$floors = mysqli_query($conn, $sql);
while ($floor = mysqli_fetch_array($floors, MYSQLI_ASSOC)):
;
?>
<option value="<?php echo $floor['fname']; ?>">
<?php echo $floor['fname']; ?>
</option>
<?php endwhile; ?>
</select>
</form>
</div>
<div id="displayTable" class="mt-3" style="width: 90%; margin:0 auto;"></div>
<script src="tables/table.js"></script>
<script>
function filterByFloor() {
var selectJob = document.getElementById("floorSelect"),
table = document.getElementById("displayTable"),
tr = table.getElementsByTagName("tr");
for (var i = 1; i < tr.length; i++) {
floor = tr[i].getElementsByTagName("td")[9]; // use [0] as the first `td`
console.log(floor);
if (floor && floor.innerHTML.indexOf(selectJob.value) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
// listen to select changes
document.querySelector('#floorSelect').addEventListener('change', function (e) {
filterByFloor();
});
</script>

table.js:

//display open table
function displayOpen() {
var displayOpen = "true";
$.ajax({
url: "open.php",
type: 'post',
data: {
displaySend: displayOpen
},
success: function (data, status) {
$('#displayTable').html(data);
}
})
}

open.php:

<h2>OPEN</h2>
<?php
// date_default_timezone_set('Asia/Jakarta');
// $currentDateTime = date('Y-m-d H:i:s');
// echo $currentDateTime;
include 'database/connect.php';
if (isset($_POST['displaySend'])) {
$table = '<table class="table table-sm table-bordered table-striped table-hover">
<thead class="text-center align-middle">
<tr>
<th scope="col">NO</th>
<th scope="col">DETAILS</th>
<th scope="col">MODEL</th>
<th scope="col">PIC</th>
<th scope="col">OPEN DATE</th>
<th scope="col">TARGET DATE</th>
<th colspan="3" scope="col">REMARKS</th>
<th scope="col">FLOOR</th>
<th scope="col">ACTION</th>
</tr>
</thead>
<tbody class="table-group-divider" style="font-size:0.9rem;">';
$sql = "SELECT * FROM d_mom WHERE status='OPEN' ORDER BY opendate DESC";
$result = mysqli_query($conn, $sql);
$number = 1;
while ($row = mysqli_fetch_assoc($result)) {
$id = $row['momid'];
$details = $row['momdetails'];
$model = $row['model'];
$pic = $row['pic'];
$opendate = $row['opendate'];
$targetdate = $row['targetdate'];
$remarks = $row['remarks'];
$updatedate = $row['updatedate'];
$updateby = $row['updateby'];
$floor = $row['floor'];
// $status = $row['status'];
$table .= '
<tr>
<td scope="row" class="text-center">' . $number . '</th>
<td>' . $details . '</td>
<td class="text-center">' . $model . '</td>
<td class="text-center">' . $pic . '</td>
<td class="text-center">' . $opendate . '</td>
<td class="text-center">' . $targetdate . '</td>
<td>' . $remarks . '</td>
<td class="text-center">Updated on: ' . $updatedate . '</td>
<td>By: ' . $updateby . '</td>
<td class="text-center">' . $floor . '</td>
<td class="text-center">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
Action
</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Update</a></li>
<li><a class="dropdown-item" href="#" onclick="updateToUM(' . $id . ')">Under Monitoring</a></li>
<li><a class="dropdown-item" href="#" onclick="updateToClosed(' . $id . ')">Closed</a></li>
<li><a class="dropdown-item" href="#" onclick="deleteMoM(' . $id . ')">Delete</a></li>
</ul>
</div>
</td>
</tr>';
$number++;
}
$table .= '</tbody>
</table>';
echo $table;
}
?>

With the code above I'm able to display the table as pictured. But when I put open.php inside the tables folder, it will no longer display the table. I tried changing the url to tables/open.php, /tables/open.php, ../tables/open.php, mom_tracking/tables/open.php, but nothing works.

Did you move all relevant parts into the new tables folder? For instance, within open.php you have the line:

include 'database/connect.php';

Does the database directory exist in the new location alongside open.php?

Then where you adjust this line in table.js:

    url: "open.php",

To use either the full URL, or absolute path, ie.

    url: "/tables/open.php",

or

    url: "https://yoursite.com/wherever/tables/open.php",

If you open this page in the browser as your JSON (AJAX) request would, does it output the expected result? There's no error?