В моей базе данных есть таблица, которую я бы хотел отобразить в datatable
. Таблица имеет 3 столбца id, name and datecreated
. Я хочу, чтобы пользователи могли удалять строки из этой таблицы, нажимая delete button
в каждой строке, поэтому графическое представление этого будет выглядеть как
|name |title| date|Delete Button|
Прежде чем загружать данные в мой datatable
, просто перетаскивая все строки в моей базе данных и iterating
через них, устанавливая содержимое, как это
<table id="example23" class="display nowrap table table-hover table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Delete</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Delete</th>
</tr>
</tfoot>
<?php foreach ($messages as $message) {?>
<tr class="info">
<td><?php echo $message['name']; ?> </td>
<td> <?php echo date('d-M-Y', strtotime($message['datecreated'])); ?></td>
<td><a href="<?php echo $_SERVER['PHP_SELF'].'?delete='.$message['id']; ?>"
<form method="get">
<button class="btn btn-success btn-rounded" type="button" type="submit" name="submit">DELETE</button>
</form>
</td>
</tr>
<?php } ?>
</table>
Это было легко, но со временем я заметил, что это плохо для 1000+ строк, это действительно плохо работает, поэтому я решил switch to server side processing
, используя Ajax
, чтобы сделать запрос вроде
('#example123').DataTable({
"bProcessing": true,
"ajax":{
url :"../public/messages",
type: "POST",
error: function(xhr, status, error) {
console.log('Error::'+xhr.responseText);
$('#loader').hide();
},
beforeSend: function(){
$('#loader').show();
},
complete: function(){
$('#loader').hide();
}
},
С моей настройкой бэкенда, как
public function fetchMessages($draw, $start, $length, $query, $orderColumn, $orderDir){
//*getting total number records without any search
$sql = "SELECT id, name, datecreated from messages";
$stmt = $this->conn->prepare($sql);
$stmt->execute();
$stmt->store_result();
$totalData = $stmt->affected_rows;
$totalFiltered = $totalData;
//*Search
$sql = "SELECT id, name, datecreated from messages";
if(!empty($query)) {
$query = "%{$query}%";
$sql.=" WHERE name LIKE ? )";
$stmt = $this->conn->prepare($sql);
$stmt->bind_param("sss", $query, $query, $query);
}
$stmt->execute();
$stmt->store_result();
$totalFiltered = $stmt->affected_rows;
$sql.=" ORDER BY ". $orderColumn." ".$orderDir." LIMIT ".$start." ,".$length." ORDER BY e.datecreated DESC";
$stmt->execute();
$events = array();
$stmt->bind_result($id, $name, $datecreated);
while($stmt->fetch())
{
$message = array();
//$message[] = $id; Once I include id, it goes into the name column and the name goes into the datecreated column
$message[] = $name;
$message[] = $datecreated;
$messages[] = $message;
}
$json_data = array(
"draw" => intval($draw),
"recordsTotal" => intval($totalData),
"recordsFiltered" => intval($totalFiltered),
"data" => $messages
);
return $json_data;
}
Это прекрасно загружает данные. Моя проблема непохожа на мое первое решение, где я использовал идентификатор для удаления контента, у которого нет идентификатора в этой таблице, в тот момент, когда я включаю ID
в json
, который он хочет, заменяет name
и name
заменяет datecreated
. Я искал способ, которым я мог бы включить ID
в data
, но скрыть и использовать аналогичную логику, которая использовалась В этом официальном учебнике данных , чтобы получить идентификатор и использовать его для удаления нужной строки .