I have a table that will display images stored in a DB as well as some other information. I have a column that has a link that the user can click to delete the image, this works fine however when the user does this I also want to remove the row that the user selects to remove but I can't seem to get it to work.
function removeSectionPhoto(image, section_id) {
if(confirm("Are you sure you want to delete this image?") == true) {
$.ajax({
type: "POST",
url: "remove_section_photo.php",
data: 'image='+image+'§ionID='+section_id,
success: function(data){
//this is supposed to remove the row but currently doesnt work
$("#"+$(this).data("remove-row")).remove();
}
});
}
}
The table rows are being output from PHP, this is what one of the table rows looks like:
echo "<tr id='fac_sec_photo_row". $imageRowCount ."'>";
echo "<td><a><img class='section_photo' src='" . $sectionPhotoRow['photo'] . "' alt='Section Photos' height='50' width='50'</a></td>";
echo "<td><input type='text' id='photoDesc' name='photoDesc[]' value='" . $sectionPhotoRow['photo_desc'] . "'</td>";
echo "<td><input type='file' id='new_section_photo' name='new_section_photo[]' onchange='displaySecImage(this)'></td>";
echo "<td><a href='#' class='removeImageRow' data-remove-row='fac_sec_photo_row". $imageRowCount . "' onClick='removeSectionPhoto(\"". $sectionPhotoRow['photo'] ."\", \"". $facilitySecId ."\")'>Remove</a></td>";
echo "</tr>";
What am I doing wrong, how can I remove the selected table row?