Travailler avec un input file /jquery/php

**wwilly17** · 12/11/2015, 14h29

bonjour ,
voici mon probleme : j ai un formulaire d ajout d 'evenement auquel je souhaiterais ajouter une piece jointe ,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<body>
<div id="form_ajoutevt" style="width:800px" title="Ajouter un événement">
	<form id="f_ajoutevt" method="post" action="#">
		<p><label>Tire de l' événement (*) ) :</label><input type="text"  id="I_titre_evt" maxlength="100"" size="25" /> </p>
		<p><label>Pièce jointe </label><input type="file" id="I_fichier" />
	</form>
</body>

Lors du clic sur le bouton d ajout je traite les données en jquery pour faire et les test et surtout ajouter l' evenement via la methode $.post qui va permettre d envoyer les informations saisie a un fichier *.php afin d effectuer le traitement des données
voici le code jquery

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<script>
$(function()
{



$("#form_ajoutevt").dialog(
{
autoOpen:false,
resizable:false,
buttons:{
		
			"Ajouter":function()
						{
							if ($("#I_titre_evt").val()=="")
							{
								alert ("Veuillez donner un titre à l' évenement")
							}
							var vtitre=$("#I_titre_evt").val();
							var vfichier=$("#I_fichier").val();//fichier à uploader
							
							
							$.post("controleur/ctrl_ajout_evt.php",{vfichier:vfichier,vtitre:vtitre},function(data)
								{
									if (data['rep']=='1')
									{
										$("#form_ajoutevt").dialog("close");
										
									}
									
								},"json")
							
							
							
						}
	
		}
}
)


}
</script>

voici le fichier ctrl_ajout_evt.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
<?php
 
$vtitre=$_POST['vtitre'];
$vfichier=$_POST['vfichier'];
 
$infofichier= pathinfo($_FILES['vfichier']['name'];
echo $infofichier;
 
?>

c est dedans que j aimerais faire l upload de mon fichier or deja lors de l affichage de la variable $infofichier il y a un probleme car il me repond que la variable n existe pas.Je n arrive pas a traiter le fichier .
comment puis je faire pour transmettre mon fichier à uploader au fichier ctrl_ajout_evt.php ?
auriez vous une idée ?

merci d avance

**ABCIWEB** · 12/11/2015, 16h07

Salut,

Il y a une solution toute prête ici pour faire de l'upload de fichier en ajax avec javascript/jquery et php côté serveur. Tu pourras ajouter les champs que tu veux dans le formulaire, ils seront transmis automatiquement côté serveur.

En fait sur le principe tu n'as pris le problème par le bon bout. Il faut commencer par faire un formulaire d'upload puis ajouter des champs textes, pas l'inverse.

Sinon tu t'embêtes pour rien avec tes contrôles javascript sur les champs requis. Il suffit de mettre la mention "required" dans l'input du champ html et c'est tout. Si c'est vraiment indispensable évidemment il faudra de toutes façons refaire le contrôle côté serveur mais ça n'apporte rien de le faire en javascript.

**ABCIWEB** · 12/11/2015, 16h20

EDIT Je viens de me souvenir de ton nom et t'avoir déjà répondu dans un autre topic. Si tu as déjà essayé le module d'upload donné en lien plus haut mais que tu n'as pas tout compris, éventuellement je peux t'aider...

**wwilly17** · 12/11/2015, 17h21

oui tu m avais repondu, le fait est que je n ai pas encore pu tester ton plugin, mais je les telecharger me manque juste le temps de le tester car je suis a la bourre sur mon projet..
maintenant pourquoi dis tu que je prend le probleme par le mauvais bout ?
je ne vois pas pourquoi faire d abord le formulaire d upload puis le formulaire d evenement sachant que l upload doit se faire justement apres l enregsitrement de mon evenement en base de donnée.C est pour ca que j avais repose la question car je combine a la fois l insertion en base via de l ajax mais aussi un upload de fichier.
Pour le required j ai essaye mais le probleme qui m est apparue c est que l ' evenement "click" de mon bouton s effectue avant le controle du champ "required" voila pourquoi je me suis senti obligé d' integrer un controle de saisie dans mon evenement.

**ABCIWEB** · 12/11/2015, 17h46

Envoyé par wwilly17

maintenant pourquoi dis tu que je prend le probleme par le mauvais bout ?
je ne vois pas pourquoi faire d abord le formulaire d upload puis le formulaire d evenement sachant que l upload doit se faire justement apres l enregsitrement de mon evenement en base de donnée.C est pour ca que j avais repose la question car je combine a la fois l insertion en base via de l ajax mais aussi un upload de fichier.

Parce que l'upload de fichier ajax/jquery demande un code spécifique, qui n'est pas une petite évolution d'un formulaire classique mais tout autre chose. Il faut commencer par le code le plus contraignant sinon tu devras tout refaire (comme dans ton exemple).
Mais cela n'empêche pas pour autant de conditionner l'upload à la présence de certains champs du formulaire ou même d'envoyer des champs textes sans nécessairement faire d'upload. C'est toi qui choisi au final, la méthode d'intégrer des champs textes dans le formulaire d'upload n'impose rien en elle même (pas même l'upload d'un fichier), c'est les conditions que tu mettras dans ton code qui feront la différence.

**wwilly17** · 12/11/2015, 17h49

je viens de regarder ton travail, d abord bravo car c est bien documente , bien fait ..
Je suis pret a l utiliser mais j avaoue j ai du mal a comprendre...
j ai regarder le basique qui me correspondrait tres bien ..
premiere question : ou gere tu l evenement click du bouton envoyer ?
deuxieme question : dans mon cas je dois recuperer les valeurs des autres champs input de mon formulaire , ou les recuperer ? car j ai regarder dans UploadAjaxABCI_Php_Load_Basique.php , je ne vois rien..tu travailles avec l id du formulaire mais comment recuperer les champs ?
en gros peux tu expliquer comment se gere les differents evenements ? le cheminement car pas evident à suivre ..

**ABCIWEB** · 12/11/2015, 18h27

Envoyé par wwilly17

premiere question : ou gere tu l evenement click du bouton envoyer ?

Cela dépend de ce que tu veux en faire. Normalement il est gérer automatiquement par la classe.
En cas de besoin spécifique tu peux utiliser la fonction événementielle

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

config.func_FormSubmit(event,tableau){// là tu mets le code que tu veux;}

qui sera déclenchée à la soumission du formulaire.
Mais il est probable qu'on puisse éviter de l'utiliser. Dis-moi précisément le processus de ton formulaire et les contrôles que tu veux faire.

Envoyé par wwilly17

deuxieme question : dans mon cas je dois recuperer les valeurs des autres champs input de mon formulaire , ou les recuperer ? car j ai regarder dans UploadAjaxABCI_Php_Load_Basique.php , je ne vois rien...

Tu ne vois rien parce que je ne peux pas deviner à l'avance les champs que tu veux ajouter

Surtout il est écrit en haut de ce fichier

Voir le fichier "UploadAjaxABCI_Php_Load.php" pour plus d'exemples détaillés.

Evidemment le code basique est pour montrer le basique minimum, donc le reste de la doc est ailleurs

Et quand tu arrives dans le fichier "UploadAjaxABCI_Php_Load.php" tu peux lire en haut de la page :

/* NOTE : Si vous avez ajouté des champs input dans votre formulaire, utilisez la fonction urldecode() pour récupérer vos variables ex : $ma_variable = urldecode($_POST['ma_variable']) ;*/

Travailler avec un input file /jquery/php

jQuery

Vue hybride

Discussions similaires

Partager

Partager