11521 sujets

JavaScript, DOM et API Web HTML5

Supprimez le fichier image uplode en utilisant le code d'ajax et js

Bonjour !
je suis à la recherche de l'aide pour faire fonctionner se code. l'objectif est de supprimé la photo upload avec l'ajax , javascript et php pour éviter de rafraîchir la page web. je suis bloqué à ce niveau...je le fais en php, mais la page est rafraîchie après suppression du fichier image. Ainsi, j'ai pu avoir ce code sur mes archives dont je ne retrouve plus la source. ci joint le code:


<?php
$files = "394e910bee43b1f96c7d102ef02f25639c96b373.656866775.jpg"; // nom du fichier à supprimer dans la racine
echo '<form>';
echo '<input type="hidden" value="'.$files.'" name="delete_file" id="delete_file" />';
echo '<input type="button" value="Delete image" onclick="delete_image()"/>';
echo '</form>';
?>
//javascript appel ajax pour supprimer le fichier.
<script>
function delete_image()
{
  var status = confirm("Are you sure you want to delete ?");
  if(status==true)
  {
        var file = $("#delete_file").val();
        $.ajax({
          type:"POST",
          url:"ImageLap.php",
          data:{file:file},
          success(html){
           alert('Deleted');
          }
        });
  }
}
</script>

Ci joint le fichier ImageLap.php // suppression du fichier image

<?php
if ( array_key_exists ('delete_file', $_POST ) ) {
           $filename = $_POST['delete_file'];
           if ( file_exists ( $filename ) ) {
                   unlink( $filename );
                   echo 'File '.$filename.' has been deleted';
           }
  }
 
?>


S.V.P, votre aide m'est précieuse, mon projet est bloqué à ce niveau... Smiley fache
A la rigueur, si le bouton était un <input type=submit />, il validerait le formulaire, ce qui rafraîchirait la page, mais non, c'est un simple <input type=button /> ...

Le code ci-dessus n'a pas de raison de rafraîchir la page.

La raison de ce comportement se trouve sûrement à un endroit dans le code source de la page.
Hmm...

submit ou button n'est pas important ici. le but est de ne pas recharger le formulaire, mais faire de l'ajax. donc avec un onclick sur un button comme ici c'est tout à fait possible.


Dans ton php, il faudrait voir si ton POST est bien remplit

un petit var_dump($_POST); die();
Merci à JENCAL et NUWEB !
Vous avez compris mon souci, mais j'ai pu avoir la solution en faisant de l'Ajax sans rafraichir le formulaire. En effet, les variables PHP peuvent être utilisés en récupérant les valeurs des variables déclarées en JS comme aussi en AJAX. Ainsi, le code Ajax modifié:


// delete file upoad    
function delete_image()
{
  var status = confirm("Are you sure you want to delete ?");  
  if(status==true)
  {
    var file = $("#delete_file").val();
    var repdossier = $("#repdossier").val();
    $.ajax({
      type:"POST",
      url:"ImageLap.php?file="+file+"&repdossier="+repdossier+"",
      data:{file:file},
      success(html){
       alert('File '+file+' has been deleted');
      }
    });
  }
 }


et le code PHP modifié:


if (isset($_GET['file']) && ($_GET['file']!='') && isset($_GET['repdossier']) && ($_GET['repdossier']!=''))
{
     $filename = $_GET['file'];
        $repdossier = $_GET['repdossier'];
            if ( file_exists ('.$repdossier.'/'.$filename .'') ) {
                unlink( '.$repdossier.'/'.$filename.'' );
       }
}


et ça marche !
Pour l'instant, je suis en train de réfléchir, une fois la photo supprimée dans le dossier et comment l'enlevé au niveau de la page web sans rafraîchir la page ?
Je ne sais, si de votre côté vous pouvez me donner quelques pistes de solution en regardant la partie success(html) du code AJAX ? Smiley fache
Sujet clos
Aller à