11487 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

Je reviens une fois pour trouver une solution à mon problème. Je réalise un upload d'image de sorte à afficher celle-ci sans click sur un bouton submit, ni rechargement de la page. Mon image ne s'affiche pas. J'espère trouver quelqu'un pour m'aider à résoudre ce problème.

Merci par avance!

Mon code ci-dessous:

Code HTML:

<form id="uploadForm" method="post" action="upload.php" enctype="multipart/form-data" class="form-row-style">
       <div id="uploadFichier">
             <input id="inputFile" type="file" name="avatars">
       </div>
</form>


Code JS:

$(document).ready(function(e) {
  $('#inputFile').bind('click', function(e){
       e.preventDefault();
       $('input[name="avatars"]').submit();
   });

   $('Input[name="avatars"]').change(function (){
       $("#uploadForm").submit();
   });

   //$('body').on('click','#uploadForm', function(e) {
	 $('body').on('submit', '#uploadForm', function(e) {   
      e.preventDefault();
      $.ajax({
		   url: "inc/php/upload.php",
           type: "POST",
           data: new FormData(),
           contentType: false,
           cache: false,    
           processData:false,  
           success: function (retour) {
               //alert('retour');
               window.location.reload();
           },
           dataType: "html"
       });
   });
});


Code PHP:

$ds = DIRECTORY_SEPARATOR;
$dossierStockage = '/images/';
 
if(is_array($_FILES)) {
     if(is_uploaded_file($_FILES['tmp_name'])) {
           $tempFile = $_FILES['tmp_name'];
           $cheminSource  = dirname(__FILE__).$ds.$dossierStockage.$ds;
       $cheminCible = $cheminSource.$_FILES['name'];
           // Sauvegarde
           move_uploaded_file($tempFile, $cheminCible);
      }
}

Modifié par dinolam (29 May 2015 - 17:24)
C'est quoi ta question ? Pourquoi ton image ne s'affiche pas ? Parce qu'il n'y a rien dans ton code qui demande l'affichage de l'image.