Button to delete PHP photo with Jquery

Question

Good afternoon. I need to include a button in my editing form so I can delete the user’s photo. I’d like to do with jquey and ajax, I’m still learning. I’m using mysql that stores only the photo path, the file stays in a folder on the server. Someone could give at least one way to go... or some idea Below is my code:

<div class="form-group">
        <label for="foto_aluno" class="col-sm-2 control-label">Alterar foto</label>
        <div class="col-sm-10">
            <input type="file" class="form-control-file" id="foto_aluno" name="arquivo">
    </div>

    </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
            <button  class="btn btn-danger btn-sm" id="btn_excluir">Excluir foto</button>
            </div>
     </div>

At the end of the page:

<script type="text/javascript">
$(document).ready(function(){
     $('#btn_excluir').click(function(){
        alert('Aqui o código para excluir');
     })
 })
</script>

Answer 1

Use Ajax in jquery by clicking the button to run the script in php

<script type="text/javascript">
$(document).ready(function(){
     $('#btn_excluir').click(function(){

$.ajax({method: "POST", url: "linkdoseuscript.php",
            data: { codigodafoto: "xxxxxx" }
       }).done(function( msg ) {
            alert( "Resposta do php: " + msg );
      });


     })
 })
</script>

Then inside your php script you search the database for the code of your photo, and use the function unlink php to remove the file. (http://php.net/manual/en/function.unlink.php)

Just be careful with this function to not delete what you should not, use a check before if the file actually exists with is_file for example:

if (is_file($path.'/'.$file)) { 
     @unlink($path.'/'.$file); 
  }