Stocker dans variable php plusieurs valeurs (ajax-php)
lerod83
Messages postés
64
Date d'inscription
Statut
Membre
Dernière intervention
-
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
Finalement j’ai arrivé à faire les actions suivantes, merci de vos conseils :
- Uploader multiple images avec Ajax et les envoyer au serveur sans rafraichir la page,
- Supprimer instantanément les images uploadés,
- J’ai pu aussi récupérer sur variable PHP le nom des images uploadés
MAIS j’ai de problème pour les stocker un par un dans plusieurs variables pour envoyer avec le formulaire avec le bouton Submit. J’ai essayé avec la Variable SESSION mais je n’y arrive pas.
Je sollicite vos soutiens chers collegues.
Si vous avez du temps, merci de simuler avec mes scripts ci bas parce que j’ai peut-être pas claire avec l’explication. C'est un peu plus long mais je pense que cela peut, aussi, aider quelqu'un un jour;
Mille merci.
index.php
ajaximage.php
delete.php
pass_value.php
Si vous avez une idée pour une barre de progression aussi.
Merci à tous, en espérant vos suggestion.
Finalement j’ai arrivé à faire les actions suivantes, merci de vos conseils :
- Uploader multiple images avec Ajax et les envoyer au serveur sans rafraichir la page,
- Supprimer instantanément les images uploadés,
- J’ai pu aussi récupérer sur variable PHP le nom des images uploadés
MAIS j’ai de problème pour les stocker un par un dans plusieurs variables pour envoyer avec le formulaire avec le bouton Submit. J’ai essayé avec la Variable SESSION mais je n’y arrive pas.
Je sollicite vos soutiens chers collegues.
Si vous avez du temps, merci de simuler avec mes scripts ci bas parce que j’ai peut-être pas claire avec l’explication. C'est un peu plus long mais je pense que cela peut, aussi, aider quelqu'un un jour;
Mille merci.
index.php
<?php session_start(); ?> <html> <head> <script src="[https://code.jquery.com/jquery-3.0.0.min.js]"></script> <style> .rCol{ background:; /*width:160px;*/ height:90px; overflow:hidden; } .dialog{ display:inline-block; margin-right:10px; } .dialog img{ height:85px; } .close-classic{ font-family:arial,sans serif; font-size:18px; vertical-align:top; background:#fff; color:#000; padding:3px 10px; position:relative; left:-25px; top:0px; text-decoration:none; transition:all 0.3s; z-index:1000; } .close-classic:hover{ opacity:0.7; } #uploadPreview1{ height: 85px; margin-top: 3px; } .fileUpload { position: relative; overflow: hidden; background-color: none; height: 85px;display:inline-block; text-align: center; border-radius: 6px; } .fileUpload input.upload { position: absolute; top: 0; right: 0; margin: 0px 0px 0px 0px; padding: 0; font-size: 20px; cursor: pointer; opacity: 0; filter: alpha(opacity=0); height: 100%; text-align: center; } #prv{ height:auto; width:auto; float:left; margin-bottom: 28px; background:none; } </style> </head> <body> <script> //Fonction upload Javascript et ajax function submitForm() { var fcnt = $('#filecount').val(); var fname = $('#filename').val(); var imgclean = $('#file'); if(fcnt<=5) { data = new FormData(); data.append('file', $('#file')[0].files[0]); var imgname = $('input[type=file]').val(); var size = $('#file')[0].files[0].size; var ext = imgname.substr( (imgname.lastIndexOf('.') +1) ); if(ext=='jpg' || ext=='jpeg' || ext=='png' || ext=='gif' || ext=='PNG' || ext=='JPG' || ext=='JPEG') { if(size<=5000000) { $.ajax({ url: "ajaximage.php", type: "POST", data: data, enctype: 'multipart/form-data', processData: false, // tell jQuery not to process the data contentType: false // tell jQuery not to set contentType }).done(function(data) { if(data!='FILE_SIZE_ERROR' || data!='FILE_TYPE_ERROR' ) { fcnt = parseInt(fcnt)+1; $('#filecount').val(fcnt); var img = '<div class="dialog" id ="img_'+fcnt+'" ><img src="img_uploads/'+data+'" onLoad="return session('+fcnt+')"/><input type="hidden" id="photo_'+fcnt+'" name="photo_'+fcnt+'" value="'+data+'"><a href="#" id="rmv_'+fcnt+'" onclick="return removeit('+fcnt+')" class="close-classic">x</a></div><input type="hidden" id="name_'+fcnt+'" name="name_'+fcnt+'" value="'+data+'">'; $('#prv').append(img); if(fname!=='') { fname = fname+','+data; }else { fname = data; } $('#filename').val(fname); imgclean.replaceWith( imgclean = imgclean.clone( true ) ); } else { imgclean.replaceWith( imgclean = imgclean.clone( true ) ); alert('SORRY SIZE AND TYPE ISSUE'); } }); return false; }//end size else { imgclean.replaceWith( imgclean = imgclean.clone( true ) );//Its for reset the value of file type alert('Sorry File size exceeding from 1 Mb'); } }//end FILETYPE else { imgclean.replaceWith( imgclean = imgclean.clone( true ) ); alert('Sorry Only you can uplaod JPEG|JPG|PNG|GIF file type '); } }//end filecount else { imgclean.replaceWith( imgclean = imgclean.clone( true ) ); alert('06 photos maximum'); } } //suppression de l'image function removeit (arg) { var id = arg; // GET FILE VALUE var fname = $('#filename').val(); var fcnt = $('#filecount').val(); // GET FILE VALUE $('#img_'+id).remove(); $('#rmv_'+id).remove(); $('#img_'+id).css('display','none'); var dname = $('#name_'+id).val(); alert(dname); $.ajax({ url: 'delete.php', type: 'POST', data:{'name':dname}, success:function(a){ console.log(a); } }); fcnt = parseInt(fcnt)-1; $('#filecount').val(fcnt); var fname = fname.replace(dname, ""); var fname = fname.replace(",,", ""); $('#filename').val(fname); } //pour stocker dans variable PHP les images uploadé/envoyé au serveur function session (arg) { var fcnt = $('#filecount').val(); var id = arg; var Pname = $('#photo_'+id).val(); var dataString = 'Pname=' + Pname; alert(Pname); $.ajax({ type: "POST", url: "pass_value.php", data: { sary: Pname, cpt: fcnt, }, dataType: 'json', cache: false, success: function(response) { alert(response.message); } }); } </script> <?php if(isset($_POST['subUpload'])){ echo $_SESSION['sary']; //unset($_SESSION['sary']); } ?> <form action="" method="POST"> <input type="text" name="nom"/><br/> <input type="text" name="prenom"/><br/> <div class="rCol"> <div id ="prv"></div> <div class="fileUpload"> <span class="custom-span"> <img id="uploadPreview1" src="../images/img_bouton/add_photo1.GIF"> </span> <p class="custom-zpara">Ajouter une photo</p> <input type="file" id="file" class="upload" name='file' onChange=" return submitForm();"> <input type="hidden" id="filecount" value='0'> </div> </div> <input type="hidden" name="myPhoto[]" value="<?php echo 2; ?>"/> <input type="submit" name="subUpload" value="Valider"/> </form> </body> </html>
ajaximage.php
<?php $filetype = array('jpeg','jpg','png','gif','PNG','JPEG','JPG'); foreach ($_FILES as $key ) { $name =time().$key['name']; $path='img_uploads/'.$name; $file_ext = pathinfo($name, PATHINFO_EXTENSION); if(in_array(strtolower($file_ext), $filetype)) { if($key['name']<1000000) { @move_uploaded_file($key['tmp_name'],$path); echo $name; } else { echo "FILE_SIZE_ERROR"; } } else { echo "FILE_TYPE_ERROR"; }// Its simple code.Its not with proper validation. } ?>
delete.php
<?php session_start(); $path='img_uploads/'.$_POST['name']; if(@unlink($path)) { echo "Success"; } else { echo "Failed"; } ?>
pass_value.php
<?php session_start(); $_SESSION['isa'] = $_POST['cpt']; $_SESSION['sary']=$_POST['sary']; ?>
Si vous avez une idée pour une barre de progression aussi.
Merci à tous, en espérant vos suggestion.
A voir également:
- Stocker dans variable php plusieurs valeurs (ajax-php)
- Easy php - Télécharger - Divers Web & Internet
- Expert php pinterest - Télécharger - Langages
- Retour a la ligne php - Forum Webmastering
- Impossible de créer le fichier de travail. vérifiez la variable d'environnement temp ✓ - Forum Word
- Alert php - Forum PHP
1 réponse
Bonjour,
Je ne comprend pas trop ta question (ni le besoin....)
Pourquoi veux tu renvoyer les variables dans ton formulaire ????
Le plus simple serait de faire le traitement DIRECTEMENT lors de l'appel à ton fichier ajax....
Et puis.. si ton but c'est de remplir ton FORM ... tu peux le faire directement dans le SUCCESS de ta fonction d'upload....
Pas besoin de faire appel à un autre script session() .... je n'en comprend pas l'interet ni le besoin;...
Je ne comprend pas trop ta question (ni le besoin....)
Pourquoi veux tu renvoyer les variables dans ton formulaire ????
Le plus simple serait de faire le traitement DIRECTEMENT lors de l'appel à ton fichier ajax....
Et puis.. si ton but c'est de remplir ton FORM ... tu peux le faire directement dans le SUCCESS de ta fonction d'upload....
Pas besoin de faire appel à un autre script session() .... je n'en comprend pas l'interet ni le besoin;...
Peut-être que j’ai mal expliqué, en fait c’est que comment récupérer les noms des images uploadés pour les faire insérer à la base de donnée MySQL avec le formulaire tout entier (dans ce script, chaque images uploadé porte toutes un même index (sary >>> $_POST[‘sary’]) et je ne sais pas comment stocker chacune sur variable différente.
Cordialement
Lerod
Dans ton fichier ajaximage.php ... tu fais déjà une boucle sur chaque image (pour faire le moveupload...)
C'est DANS cette boucle que tu dois gérer l'insertion en BDD ...
Pas besoin de faire une bidouille avec un autre script..... c'est inutile !
$path='img_uploads/'.$name;
Avant de faire l'action suivante:
move_uploaded_file($key['tmp_name'],$path);