Плагин TableEdit — две таблицы на одной странице — плагин TableEdit работает ТОЛЬКО, когда обе таблицы имеют данные

У меня есть одна веб-страница php, где у меня есть две таблицы результатов. Я применил плагины TablEdit для добавления живых функций редактирования / удаления.
Он работает ТОЛЬКО в тех случаях, когда обе таблицы имеют результаты, если какая-либо из них пуста, плагин TablEdit (Сохранить / Удалить не отображаются) не работает.

Я разделил $ (document) .ready (function () {} для каждой таблицы и поместил их в два разных блока. НО та же проблема.

<!-- UNPAID TABLE -->
$id = $_GET ['id'];
$query = "SELECT * FROM dues INNER JOIN institutions ON institutions.id =
dues.idfk and dues.idfk ='$id' and dues.dstatus ='Unpaid'";


$data = mysqli_query($con,$query);
$total = mysqli_num_rows ($data);

if($total != 0)
{
?>

<table id="unpaid_table" class="table table-bordered">
<thead>
<tr style='text-align: center;'>
<th style='display: none;'>DID</th>
<th>Year</th>
<th>Amount</th>
<th>Penalty</th>
<th>Total Dues</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php

while ($result = mysqli_fetch_assoc($data))
{

echo "<tr style='text-align: center;'>
<td style='display: none;'>".$result ['did']."</td>
<td>".$result ['year']."</td>
<td>".$result['amount']."</td>
<td>".$result['penalty']."</td>
<td>".$result['total']."</td>
<td>".$result['dstatus']."</td>
</tr>";
}
}
else
{
echo "<div style='color:red;'>No Records</div>";
}
?>
</tbody>
</table>


<!-- PAID TABLE -->
$id = $_GET ['id'];
$query = "SELECT * FROM dues INNER JOIN institutions ON institutions.id =
dues.idfk and dues.idfk ='$id' and dues.dstatus ='Paid'";


$data = mysqli_query($con,$query);
$total = mysqli_num_rows ($data);

if($total != 0)
{
?>

<table id="paid_table" class="table table-bordered">
<thead>
<tr style='text-align: center;'>
<th style='display: none;'>DID</th>
<th>Year</th>
<th>Amount</th>
<th>Penalty</th>
<th>Total Dues</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php

while ($result = mysqli_fetch_assoc($data))
{

echo "<tr style='text-align: center;'>
<td style='display: none;'>".$result ['did']."</td>
<td>".$result ['year']."</td>
<td>".$result['amount']."</td>
<td>".$result['penalty']."</td>
<td>".$result['total']."</td>
<td>".$result['dstatus']."</td>
</tr>";
}
}
else
{
echo "<div style='color:red;'>No Records</div>";
}
?>
</tbody>
</table>


<!-- TablEdit Script -->

<script>
$(document).ready(function(){
$('#paid_table').Tabledit({
url:'duesaction.php',
columns:{
identifier:[0, "did"],
editable:[
[1, 'year'],
[2, 'amount'],
[3, 'penalty'],
[4, 'total'],
[5, 'status', '{"Paid": "Paid", "Unpaid": "Unpaid"}']
]
},
restoreButton:false,
onSuccess:function(data, textStatus, jqXHR)
{
if(data.action == 'delete')
{
$('#'+data.did).remove();
}
}
});
});
$(document).ready(function(){
$('#unpaid_table').Tabledit({
url:'duesaction.php',
columns:{
identifier:[0, "did"],
editable:[
[1, 'year'],
[2, 'amount'],
[3, 'penalty'],
[4, 'total'],
[5, 'status', '{"Paid": "Paid", "Unpaid": "Unpaid"}']
]
},
restoreButton:false,
onSuccess:function(data, textStatus, jqXHR)
{
if(data.action == 'delete')
{
$('#'+data.did).remove();
}
}
});

});

</script>

Прекрасно работает, когда в обеих таблицах есть данные, но не работает, если в любой из таблиц нет данных.
Я хочу, чтобы это работало в обоих сценариях.

Пожалуйста помоги.