I have an edit button which should make the contents of that table editable. The button id and class looks like this.
id="edit_icon_'.$row1["client_id"].'_'.$row2["project_id"].'"
class="editbtn"
Id depends on db values. Onclick of this button, I want all the elements of a table "just one table" to be editable..
<tr>
<td id="edit_elem_'.$row2["project_id"].'_'.$row3["detail_id"].'">'.$row3["elements"].'</td>
<td id="edit_respon_'.$row2["project_id"].'_'.$row3["detail_id"].'">'.$row3["responsibilty"].'</td>
<td id="edit_remark_'.$row2["project_id"].'_'.$row3["detail_id"].'">'.$row3["remarks"].'</td>
</tr>
This is what table rows look like.. All have dynamic ids. How should i write the selectors with regex for this to work?
$(document).on('click', '.editclick', function() { //entering edit mode
var str = $(this).attr("id"); // edit_icon_1_124
var cid = str.replace(/^D+|D.*$/g, ""); // 1
var pid = num = str.replace(/.*D/g, ""); // 124
$('').each(function(){ // #edit_*_pid_* -expected, *-wildcard
$(this).attr('contenteditable','true');
});
});
Edit: P.S. I have multiple tables generated on the same page..