title: Deleting an image only after the form is submitted
body: <p>After a picture is uploaded I want to let the user have the option to delete it by clicking on the 'x' on the image. I tried some jquery codes that I searched online but nothing had the result I want. Is there a way to remove the image from the database only when the submit button is clicked rather than redirecting to a delete page and then having to go back to delete another image?</p>
  
  <pre><code>if($res18 &amp;&amp; mysql_num_rows($res18) &gt; 0){
      while($row18 = mysql_fetch_assoc($res18)){
  
          if (file_exists($row18['images']) === true){    ?&gt;
              &lt;a href="javascript:return(0);" class="addition_images_close" onclick="delete('&lt;?php echo $row18['id']; ?&gt;')""&gt;&lt;/a&gt;
              &lt;?php                                   
              //mysql_query("DELETE FROM `images` WHERE `images`='".$row18['images']."' AND `ad_id` = '".$id."'");            
              echo '&lt;img src="'.$row18['id'].'" class="pictures"&gt;';       
          }
      }
  } 
  </code></pre>
  
  <p>insert quesry:</p>
  
  <pre><code>mysql_query("INSERT INTO `images` ($fields) VALUES ($data)");
  </code></pre>
  
  <p>I assume the logic would be somewhat like this: Once the 'x' link is clicked, run a function that runs the delete query.</p>
  
  <p>Any help is appreciated!</p>
  
  <p><strong>UPDATE:</strong></p>
  
  <pre><code>$res18 = mysql_query("SELECT * FROM `images` WHERE `ad_id` = '" . $id . "'");
      if($res18 &amp;&amp; mysql_num_rows($res18) &gt; 0){
          while($row18 = mysql_fetch_assoc($res18)){
              $picture = $row18['images'];
              $pic_id = $row18['id'];
  
              if (file_exists($picture) === true){ ?&gt;
                  &lt;a href="javascript:return(0);" class="addition_images_close" data-id=&lt;?php echo $pic_id ?&gt; id="a-&lt;?php echo $pic_id ?&gt;"&gt;&lt;/a&gt;                                       
                   &lt;img src="&lt;?php echo $picture ?&gt;"  id="img-&lt;?php echo $picture ?&gt;" class="pictures"&gt;
              &lt;?php                   
              }
          }
      } 
  
  &lt;script type="text/javascript"&gt;
      $(document).ready(function(){
          // set onclick for all 'a' elements having the 'addition_image_close' class
          $('a.addition_images_close').click(function() {
              var $pic_id = $(this).prop('data-id');
              var $picture = $(this).prop('data-id');
              // post to delete.php, sending id=$picture as data and setting success handler
              $.post('delete.php', {id: $picture}, function() {
                  // remove elements from page
                  $('#img-' + $picture).remove();
                  $('#a-' + $pic_id).remove();
              });
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>and the delete.php has the following:</p>
  
  <pre><code>$id = $_GET['id'];
  mysql_query("DELETE FROM `images` WHERE `ad_id` = '".$id."'");
  </code></pre>