Codeigniter Delete From Database Based on Class of HTML Element - php

Question

I am using Codeigniter. I generate a view that contains a table within a form with <tr>s like this:
<tr>
<td><input name="set[2][order]" value="3">
<input type="hidden" name="set[2][ex_id]" value="1"></td>
<td><input name="set[2][weight]" value="60.00"></td>
<td><input name="set[2][reps]" value="5"></td>
<td><img class="deleteRowButton" src="/assets/images/icons/png/delete-3x.png" border="0" alt="Delete Set" title="Toggle Delete Set"/></td>
</tr>
I have a little jQuery script that toggles the class of the <tr> when the img 'delete-3x.png' is clicked:
<script>
$('.deleteRowButton').click (function() {
$(this).parents("tr").toggleClass( "deleteSet" );
});
</script>
so it looks like this:
<tr class="deleteSet">
All this does so far is change the opacity of the <tr> so I make it looks greyed out, just to signify that it has been selected for deleting.
What i want to achieve when the user submits the form and am not sure how to handle in CI, is somewhere along the line, in plain English code, saying:
if tr class = "deleteSet", then delete from db
At the moment all inputs are just written to database. so I need a way of recognising that the user want to remove an entry.

Answer 1

write one function in controller which delete item by id
Html :
<table>
<tr>
<td><input name="set[2][order]" value="3">
<input type="hidden" name="set[2][ex_id]" value="1"></td>
<td><input name="set[2][weight]" value="60.00"></td>
<td><input name="set[2][reps]" value="5"></td>
<td><img class="deleteRowButton" url="/your-controller-name/method-name/item-id" src="/assets/images/icons/png/delete-3x.png" border="0" alt="Delete Set" title="Toggle Delete Set"/></td>
</tr>
</table>
Js:
$('.deleteRowButton').off('click').on('click',function(){
var _this = $(this);
var url = $(_this).attr('url');
$.post(url,function(data){
$(_this).parents('tr').remove();
});
});

Answer 2

You need different logic, your backend will never know HTML class. It can only know POST/GET params.
What I recommend is:
User clicks on DeleteSet button on current line item.
Javascript adds that line item ID to somewhere (in memory or as HTML hidden property)
When you press "save" button it will send list of ID's that you want to delete.
Psudo Example
HTML
<tr>
<td><input name="set[2][order]" value="3"> <input class="set-id" type="hidden" name="set[2][ex_id]" value="1"></td>
<td><input name="set[2][weight]" value="60.00"></td>
<td><input name="set[2][reps]" value="5"></td>
<td><img class="deleteRowButton" src="/assets/images/icons/png/delete-3x.png" border="0" alt="Delete Set" title="Toggle Delete Set"/></td>
</tr>
JS
$('.deleteRowButton').click (function() {
$(this).disable(); // Don't want to duplicate ids
var id = $('.set-id', $(this).closest('tr')).val();
$('.submit-form').append('<input type="hidden" name="delete[]" value="' + id + '" />');
// Now when form will be submitted it will be populated with item ids you want to delete
});