Reputation: 297
I have a multi-step form that allows the user to save for later or submit. If they save for later, i want them to have an option to edit or delete but if they submit, i dont want them to have any option to edit or delete. Although the following code makes sense, its not working; i'm not getting any buttons and it breaks the jquery table plugin and i dont have the search or pagination option:
<table id="myTable" class="table table-bordered table-hover table-striped tablesorter table-responsive">
<thead>
<tr>
<td>Id</td>
<td>Status</td>
<td>Date/Time</td>
<td>Tag</td>
<td>Serial Number</td>
<td>Equipment</td>
<td>Company</td>
<td>Grand Total</td>
<td>Action</td>
</tr>
</thead>
<tbody>
<?php
while($res = mysqli_fetch_array($result)) {
echo "<tr>";
echo "<td>".$res['id']."</td>";
echo "<td><span class='label ".$res['labelwarning']."'>".$res['status']."</span></td>";
echo "<td>".$res['todaysdatetime']."</td>";
echo "<td>".$res['tag']."</td>";
echo "<td>".$res['serialnumber']."</td>";
echo "<td>".$res['currentequipment']."</td>";
echo "<td>".$res['company']."</td>";
echo "<td>".$res['total_grandtotal']."</td>";
$Submitted = "Submitted";
$Saved = "Saved";
if ($res['labelwarning'] == $Submitted) {
echo "<td></td>";
} elseif ($res['labelwarning'] == $Saved) {
echo "<td><a href=\"invoices_edit.php?id=$res[id]\" class='btn btn-info fa fa-pencil-square'></a> | <a href=\"invoices_delete.php?id=$res[id]\" class='btn btn-danger fa fa-trash' onClick=\"return confirm('Are you sure you want to delete?')\"></a></td>";
}
echo "</tr>";
}
?>
<Script>
$(document).ready(function() {
$("#myTable").dataTable({
"aaSorting": [ [0,'desc'] ]
});
});
</Script>
Upvotes: 0
Views: 37
Reputation: 2329
Oke I will try to explain this process here:
1 - First you will create a php
file where you will fetch the results you need.
when you are fetching the records you will put your results in a variable like so:
$result_html = '';
while($res = mysqli_fetch_array($result)) {
$result_html .= "<tr>";
$result_html .= "<td>".$res['id']."</td>";
...en so on
$result_html .= "</tr>";
}
To return the response to your ajax
call you need to add also this:
echo json_encode($result_html);
2 - Before the end </body>
tag
<script>
$(document).ready(function() {
$.ajax({
url: '/path/to/the_php_file',
type: 'POST',
dataType: 'json',
data : { //only needed if you have to pass parameters to your query },
})
.done(function(data) {
//data is your html response
// and #returnedResponse is the id given to your body tag
$('#returnedResponse').html(data);
$("#myTable").dataTable();
})
.fail(function() {
console.log("error");
});
});
</script>
3 - Your table
<table id="myTable" class="table table-bordered table-hover table-striped tablesorter table-responsive">
<thead>
<tr>
<td>Id</td>
<td>Status</td>
<td>Date/Time</td>
<td>Tag</td>
<td>Serial Number</td>
<td>Equipment</td>
<td>Company</td>
<td>Grand Total</td>
<td>Action</td>
</tr>
</thead>
<tbody id="returnedResponse">
</tbody>
</table>
NOTE:
You need to have the link to the jquery.js before your ajax
call.
This is not a copy and paste solution. You asked for an example on how to do it and here you have a good start point to learn it.
Upvotes: 1
Reputation: 634
Try to change your if/else part to this:
if ($res['labelwarning'] == $Submitted) {
echo "<td></td>";
} else{
echo "<td><a href='invoices_edit.php?id=$res[id]' class='btn btn-info glyphicon glyphicon-pencil'></a> | <a href='invoices_delete.php?id=$res[id]' class='btn btn-danger glyphicon glyphicon-trash' onClick=\"return confirm('Are you sure you want to delete?')\"></a></td>";
}
Upvotes: 0