Question

<?php     
 $imgcheck=mysql_query("

  SELECT *
FROM `images`
 WHERE `deal_id` =$_SESSION[eid]
LIMIT 0 , 30

 ");
 $numimgcheck=mysql_num_rows($imgcheck);
  if($numimgcheck==0){echo '<span style=color:#ff0000; >No pictures uploaded</span>';}
    while ($rowimg2= mysql_fetch_array($imgcheck)){ 


     $imgname=$rowimg2['name'];

     {
    //   $rowimg2 = mysql_fetch_array($imgcheck) or die(mysql_error());

     //echo $imgname;
     echo '    <a href="users/'.$_SESSION['userid'].'/images/'.$imgname.'"   rel="lightbox[slide]" caption=".">';
       }


       { echo '<img src="users/'.$_SESSION['userid'].'/images/thumbs/'.$imgname.'"   border="0" />';}
     { echo '</a><a href="delimg.php?id='.$imgname.'"><img src="images/del.jpg" width="22" height="22" onclick="deleteImg(this);" />   </a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     ';

    }

  //<input type="checkbox" name="'.$imgname.'" id="'.$imgname.'" > if($numimgcheck==0){      $havepic=' <td width="50px" align="center"><div class="iddivimg"> <img src="users/default/nopic_small.jpg"  />

// ‘;}

    }
    ?>

There is a page in my website where users can edit and delete images. In this page, there is a delete button (itself a 20×20 image) near every image. When the user clicks on that button, its corresponding image will be deleted. I want it to be in such a way that when I click the delete image a confirm box should appear, asking “Are you sure you want to delete this image?” If I click yes, I want to delete the MySQL table’s data and image. If I click no, nothing should happen. How can I do this?

Answer 1

Put each image in its own form with the image identifier as hidden value and use the delete image as CSS background image of the submit button. Finally use JS confirm() function for the confirmation.

<form action="delete.php" method="post">
    <img src="image1.png" />
    <input type="hidden" name="id" value="1" />
    <input type="submit" class="delete" value="" onclick="return confirm('Sure?')" />
</form>
<form action="delete.php" method="post">
    <img src="image2.png" />
    <input type="hidden" name="id" value="2" />
    <input type="submit" class="delete" value="" onclick="return confirm('Sure?')" />
</form>
...

with CSS

.delete {
    background-image: url('delete.png');
    width: 20px;
    height: 20px;
    border: 0;
    cursor: pointer;
}

This is easily done in a loop. You could use jQuery to unobtrusively introduce ajaxical powers, whenever necessary.