(06-23-2017, 11:13 PM)Paradinight Wrote: The Table:
PHP Code:
<table id="ppmpsupplies" class="table table-bordered table-hover" cellspacing="0" width="100%">
<thead>
<tr>
<th>Code</th>
<th>General Description</th>
<th>Unit</th>
<th>Quantity</th>
<th>Estimated Budget</th>
<th>Mode of Procurement</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<?php foreach ($items as $item): ?>
<tr data-id="<?= $item->id ?>">
<td><?= $item->id; ?></td>
<td><?= $item->description; ?></td>
<td><?= $item->unit; ?></td>
<td><?= $item->quantity; ?></td>
<td><?= $item->budget; ?></td>
<td><?= $item->mode; ?></td>
<td>
<button class="btn btn-warning" onclick="edit_item(<?php echo $item->id; ?>)"><i
class="glyphicon glyphicon-pencil"></i></button>
<button class="btn btn-danger" onclick="delete_item(<?php echo $item->id; ?>)"><i
class="glyphicon glyphicon-remove"></i></button>
</td>
</tr>
<?php endforeach; ?>
</tbody>
<tfoot>
<td colspan="3"></td>
<td>Total</td>
<td></td>
</tfoot>
</table>
data- is a custom attribute. I added data-id to the tr.
Code:
"edit": {
name: "Edit",
icon: "fa-pencil-square-o",
callback: function (itemKey, options) {
var id = $(this).closest('tr').data('id');
edit_item(id);
}
}
}
if you delete an item, you do not need to reload.
You can use .closest('tr').remove()
eg.
Code:
$( "#ppmpsupplies tbody" ).on( "click", "tr button.btn-danger", function() {
alert($(this).closest('tr').data('id'));
$(this).closest('tr').remove();
});
or
Code:
/*
onclick="delete_item(this,<?php echo $item->id; ?>)"
*/
function delete_item(element, id) {
alert($(element).closest('tr').data('id'));
$(element).closest('tr').remove();
}
The ajax code is necessary. the example should show how to use closest and remove
https://www.codeigniter.com/user_guide/g...e_php.html <- read it
Sir,
I got an error
undefined. When I try the delete function. I try fixing but still I got that error. I already remove the button I just wanted to used the context menu.
Code:
"delete": {
name: "Delete",
icon: "fa-trash-o",
callback: function(item, id) {
var id = $(this).closest('tr').data('id');
delete_item(id);
return true;
}
},
Code:
function delete_item(element, id) {
// if(confirm('Are you sure delete this data?'))
// if(toastr.success('successfully deleted :)', 'Success Alert', {timeOut: 5000}))
alert($(element).closest('tr').data('id'));
$(element).closest('tr').remove();
{
$.ajax({
url: "<?php echo site_url('ppmp/delete_item')?>/" + id,
type: "POST",
dataType: "JSON",
success: function(data) {
// location.reload();
},
error: function(jqXHR, textStatus, errorThrown) {
alert('Error deleting data');
}
});
}
}