В моей системе я использую data tables для хранения записей для удобства. Я использую PHP и Ajax для загрузки записей в HTML table. Всякий раз, когда я обновлял свой table с помощью операций, он успешно обновлялся без обновления страницы, но такие elements становятся невидимыми, включая filters, search box и pagination. Просто я хочу manually refresh чтобы увидеть эти elements.
Вот мои HTML сегменты кода.
<div class="row">
<div class="col-sm-12">
<div class="card-box">
<div class="card-block">
<div class="table-responsive" id="user_data">
</div>
</div>
</div>
</div>
</div>
Вот мои Ajax Query коды
/**---------Active A ROW ----------------*/
$(document).on('click', '#rep1', function () {
$("#activeid").attr('apt_id', $(this).attr('data_id'));
$("#active_appointment").modal({ show: 'true' });
});
load_data();
function load_data(){
$.ajax({
url: "sidebar/apt_table admin.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
success: function (data) {
$('#user_data').html(data);
}
});
}
$("#activeid").click(function () {
var data_id = $("#activeid").attr('apt_id');
$.ajax({
data: { 'data_id': data_id, },
type: "POST",
url: "table/apt status.php",
success: function (data) {
$('#success_mes').html(data);
$("#active_appointment").modal('hide');
load_data();
}
});
setInterval(function () {
$('#user_data').load("sidebar/apt_table admin.php").fadeIn("slow");
}, 500);
});
</script>
<script>
/**---------Cancel A ROW ----------------*/
$(document).on('click', '#rep2', function () {
$("#cancelid").attr('apt_id', $(this).attr('data_id'));
$("#delete_appointment").modal({ show: 'true' });
});
load_data();
function load_data(){
$.ajax({
url: "sidebar/apt_table admin.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
success: function (data) {
$('#user_data').html(data);
}
});
}
$("#cancelid").click(function () {
var data_id = $("#cancelid").attr('apt_id');
$.ajax({
data: { 'data_id1': data_id, },
type: "POST",
url: "table/apt status.php",
success: function (data) {
// console.log(data);
$('#success_mes').html(data);
$("#delete_appointment").modal('hide');
load_data();
}
});
setInterval(function () {
$('#user_data').load("sidebar/apt_table admin.php").fadeIn("slow");
}, 500);
});
</script>
Вот моя apt_table admin.php страница.
<table class="datatable table table-hover" >
<thead>
<tr>
<th>Appointment ID</th>
<th>Doctor Name</th>
<th>Specialization</th>
<th>Patient Name</th>
<th>Fees</th>
<th>Appointment Date</th>
<th>Appointment Time</th>
<th>Status</th>
<th class="text-right">Action</th>
</tr>
</thead>
<tbody>
<tr>
<?php
mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
try {
$conn = new mysqli("localhost", "root", "", "hmsproject");
$conn->set_charset("utf8mb4");
} catch(Exception $e) {
error_log($e->getMessage());
exit('Error connecting to database'); //Should be a message a typical user could understand
}
$query="SELECT * FROM appointment as a,users as u WHERE a.user_id= u.user_id ORDER BY apt_id DESC";
$results =mysqli_query($conn,$query);
if($results = mysqli_query($conn,$query)){
if(mysqli_num_rows($results) > 0){
while($row =mysqli_fetch_array($results) ) {
$apt_id= $row['user_id'];
$user= $row['user_id'] ;
?>
<td><?php echo $row['apt_id']?> </td>
<td> <?php echo $row['doctor_name']?></td>
<td> <?php echo $row['specilization']?></td>
<td> <?php echo $row['patient_name']?></td>
<td> <?php echo $row['fees']?></td>
<td> <?php echo $row['apt_date']?></td>
<td> <?php echo $row['apt_time']?></td>
<td>
<?php if($row['admin_status']=="0") { ?>
<span class="custom-badge status-red">Cancel</span>
<?php } else if($row['admin_status']=="1") { ?>
<span class="custom-badge status-green">Active</span>
<?php } else { ?>
<span class="custom-badge status-blue">Pending</span>
<?php } ?>
</td>
<td class="text-right">
<div class="dropdown dropdown-action">
<a href="#" class="action-icon dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-ellipsis-v"></i></a>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="" data-toggle="modal" id="rep1" data_id=<?php echo $row['apt_id'] ?> data-target="#active_appointment"><i class="fa fa-trash-o m-r-5"></i> Active</a>
<a class="dropdown-item" href="" data-toggle="modal" id="rep2" data_id=<?php echo $row['apt_id'] ?> data-target="#delete_appointment"><i class="fa fa-trash-o m-r-5"></i> Delete</a>
</div>
</div>
</td>
</tr>
<?php }}} ?>
</tbody>
</table>
Я не знаю, где я ошибся. Любая помощь может быть высоко оценена.