Ajax jquery, appel de formulaire d'envoi de fichier avec résultat sur la même page

Eléphanteau du PHP | 26 Messages

30 mai 2020, 23:38

Bonjour,

tout d'abord, je tiens à m'excuser au plus haut point pour mon niveau plus que médiocre dans beaucoup de langage.

Néanmoins, j'ai plaisir a essayé de développer quelques pages internet, même si les demandes actuelles commencent à me dépasser, et je n'ai pas les compétences d'un jeune qui va comprendre le truc en quelques minutes....

Au delà de cet aparté, voici ce qui m'a mené jusque sur ce beau forum d'entraide.

J'utilise sur mon site des formulaires (beaucoup) pour mettre à jour les données d'un membre (c'est un site de poésie).

Jusqu'à présent mes formulaires étaient en php/mysql pour mettre à jour la base de données.

J'utilisais des formulaires editpresentation.php pour le formulaire, et editpresentationenvoi.php pour le traitement du formulaire.

J'ai vu une vidéo sur youtube qui consiste à transmettre les données en ajax avec jquery et de pouvoir rester sur la même page.

J'ai donc créer une page espacemembre.php, qui affiche chaque formulaire avec des include comme

include ("includecartedevisite/editpresentation.php");

je traite le formulaire à l'aide d'ajax avec :

Code : Tout sélectionner

$(function(){ $("#editionpresentation").submit(function(){ $("#loader").show(); presentation = $(this).find("textarea[name=presentation]").val(); $.post("includecartedevisite/editpresentationenvoi.php",{presentation: presentation},function(data){ $("#loader").hide(); $("#editionpresentation").hide(1000,\'swing\'); $("#editionpresentationreponse").show().append(data); }) return false; }); });
J'affiche la réponse de la page d'envoi à l'aide d'une div cachée qui réapparait.

TOUT MARCHE PARFAITEMENT pour les envois de données dans la bdd et pour l'affichage de la réponse.

Et puis j'arrive au formulaire qui gère l'image, l'avatar du membre.

Je n'arrive pas à trouver comment faire,

j'ai essayé en mettant :

Code : Tout sélectionner

$(function(){ $("#editionphoto").submit(function(){ $("#loader").show(); photo = $(this).find("input[type=file][name=photo]").val(); $.post("includecartedevisite/editphotoenvoi.php",{photo: photo},function(data){ alert(data); }) return false; }); });
Mais ça ne marche pas. j'ai l'impression que ça ne récupère que le nom du fichier sans gérer le fichier....

Si quelqu'un comprend ce que je suis en train de faire, et aurait quelques idées à m'apporter (en restant assez simple, car je ne comprends pas encore parfaitement ce que je fais)

Merci beaucoup déjà pour votre lecture.

Eric

Avatar du membre
Administrateur PHPfrance
Administrateur PHPfrance | 9782 Messages

05 juin 2020, 14:35

Bonjour,

Il faut que tu utilises l'objet FormData dans ton appel jquery et que tu mettes processData à false.

Voici quelques tutos dont tu pourrais t'inspirer :
https://www.sanwebe.com/2014/04/ajax-co ... jquery-php
https://phppot.com/jquery/jquery-contac ... using-php/
https://makitweb.com/how-to-upload-imag ... nd-jquery/
Quand tout le reste a échoué, lisez le mode d'emploi...