Discussion :

[Bloxas_]

Bonjour, tout d'abord je ne suis pas sur de l'emplacement de mon sujet car la question est plus en php/html mais mon code étant majoritairement en Javascript je pense que si l'on n'a aucune connaissance dans ce langage la compréhension n'en sera que plus difficile.

Voici mon problème : j'ai besoin d'upload un certain nombre d'images dans un dossier précis mais ceci à partir de plusieurs types='file' différent, et je ne sais même pas si c'est possible. Upload un fichier à la fois je sais le faire mais là j'ai un nombre d'images qui peut aller de 0 à 100 et je ne peux pas demander à mon utilisateur de remplir 100 formulaires à la suite. Je ne sais pas si je suis très clair je vais donc montrer mon code : ( pour information j'utilise le framework codeIgniter )


PHP :

Code html :

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
<form class="form-horizontal" role="form" method="post" name="formulaireAjout" accept-charset="utf-8" action=<?php echo base_url("assets/codeIndependant/creation.php");?>>
	<div class='form-group'>
		<div class='col-sm-10'>
	                 <select  class="form-control" id="matiereSelect" name="matiereSelect" onchange="matiere(this.value)">
				option>Choisir une mati&egravere</option>
				<option value="anglais">Anglais</option>
				<option value="culture">Culture g&eacuten&eacuterale</option>
				<option value="francais">Fran&ccedilais</option>
				<option value="raisonnement">Raisonnement et logique</option>					
			</select>
		</div>
	</div>
	<span id="annee[]"></span>
	<span id="nbQuestion[]"></span>
	<span id="question[]"></span>
	<span id="hiddenAnnee[]"></span>
	<span id="hiddenMatiere[]"></span>
</form>

Javascript :

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
function matiere(matiere){
	var now = new Date();
	var annee   = now.getFullYear();
	var choixAnnee = "<div class='form-group'><div class='col-sm-10'><select id='anneeSelect' name='anneeSelect' class='form-control' onchange='anneeChoix(this.value)'><option>S&eacutelectionner une ann&eacutee</option>";
 
	for(i=2010; i<=annee + 1; i++)
	{
		choixAnnee = choixAnnee + "<option value="+ i +">"+ i +"</option>";
	}
	choixAnnee = choixAnnee + "</select></div></div>";
	document.getElementById("matiereSelect").disabled=true;	
	afficheR = document.getElementById("annee[]");
	afficheR.innerHTML = choixAnnee;
	afficheR = document.getElementById("hiddenMatiere[]");
	afficheR.innerHTML = "<input id='matiere' name='matiere' type='hidden' value='"+ matiere +"'>";
 
}
function anneeChoix(annee)
{
	var nombreQuestion = "<div class='form-group'><div class='col-sm-10'><select id='questionEcriture' class='form-control' onchange='ecritureQuestion(this.value)'><option>Choisir le nombre de question</option><option value='20'>20</option><option value='50'>50</option></select></div></div>";
	document.getElementById("anneeSelect").disabled=true;	
	afficheR = document.getElementById("nbQuestion[]");
	afficheR.innerHTML = nombreQuestion;
	afficheR = document.getElementById("hiddenAnnee[]");
	afficheR.innerHTML = "<input id='annee' name='annee' type='hidden' value='"+ annee +"'>";
 
}
function ecritureQuestion(nbQuestion)
{
	var question ="";
	for(i=1; i<=nbQuestion; i++)
	{
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='question'>Type d'&eacutecriture question :</label><div class='col-sm-7'><select id='typeEcriture"+i+"' class='form-control' onchange='typeQuestion(this.value, "+i+")'><option>Choisir le type d'&eacutecriture</option><option value='texte'>Texte</option><option value='image'>Image</option></select></div></div>";
		question = question + '<span id="texte'+i+'[]"></span><span id="image'+i+'[]"></span>';
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='choix1"+ i +"'>Choix r&eacuteponse n&deg;1 : </label><div class='col-sm-7'><input class='form-control' type='text' id='choix1"+ i +"' name='choix1"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix1"+ i +"' name='check"+ i +"'></label></div>";
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='choix2"+ i +"'>Choix r&eacuteponse n&deg;2 : </label><div class='col-sm-7'><input class='form-control' type='text' id='choix2"+ i +"' name='choix2"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix2"+ i +"' name='check"+ i +"'></label></div>";
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='choix3"+ i +"'>Choix r&eacuteponse n&deg;3 : </label><div class='col-sm-7'><input class='form-control' type='text' id='choix3"+ i +"' name='choix3"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix3"+ i +"' name='check"+ i +"'></label></div>";
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='choix4"+ i +"'>Choix r&eacuteponse n&deg;4 : </label><div class='col-sm-7'><input class='form-control' type='text' id='choix4"+ i +"' name='choix4"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix4"+ i +"' name='check"+ i +"'></label></div>";
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='choix5"+ i +"'>Choix r&eacuteponse n&deg;5 : </label><div class='col-sm-7'><input class='form-control' type='text' id='choix5"+ i +"' name='choix5"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix5"+ i +"' name='check"+ i +"'></label></div>";
		question = question + "<div class='form-group'><label class='control-label col-sm-2' for='question'>Type d'&eacutecriture reponse :</label><div class='col-sm-7'><select id='typeEcritureRep"+i+"' class='form-control' onchange='typeReponse(this.value, "+i+")'><option>Choisir le type d'&eacutecriture</option><option value='texte'>Texte</option><option value='image'>Image</option></select></div></div>";
		question = question + '<span id="texteRep'+i+'[]"></span><span id="imageRep'+i+'[]"></span><br/><br/>';
	}
	question = question + "<input id='nbQuestion' name='nbQuestions' type='hidden' value='"+ nbQuestion +"'>";
	question = question + "<input id='message' type='hidden' name='message'>";
	question = question + "<div class='form-group'><div class='col-sm-offset-2 col-sm-10'><button type='submit' id='boutonAjout' class='btn btn-default' onClick='envoi()'>Ajouter</button></div></div>";
	document.getElementById("questionEcriture").disabled=true;	
	afficheR = document.getElementById("question[]");
	afficheR.innerHTML = question;
}
function envoi()
{
	nbQuestion = (document.getElementById('nbQuestion').value);
	var typeQuestion;
	var typeReponse;
	var questionnaire = "<?xml version='1.0' encoding='ISO-8859-1'?><serie>\n";
	for(i=1; i<=nbQuestion; i++)
	{
 
		typeQuestion =  (document.getElementById('typeEcriture'+i+'').value);
		typeReponse =  (document.getElementById('typeEcritureRep'+i+'').value);
		if(typeQuestion == 'texte')
		{
			questionnaire = questionnaire + "<questionnaire><question type='texte'>"+ (document.getElementById('question'+i+'').value) +"</question>\n";
		}
		else
		{
			if(typeQuestion == 'image')
			{
				questionnaire = questionnaire + "<questionnaire><question type='image'>"+ (document.getElementById('question'+i+'').value) +"</question>\n";
			}
		}
 
		for(j=1; j<=5; j++)
		{	
			if(document.getElementById('choix'+j+''+i).checked)
			{
				questionnaire = questionnaire + "<choix bon='O'>"+ (document.getElementById('choix'+j+i+'').value) +"</choix>\n";
			}
			else
			{
				questionnaire = questionnaire + "<choix bon='N'>"+ (document.getElementById('choix'+j+i+'').value) +"</choix>\n";
			}
		}	
 
		if(typeReponse == 'texte')
		{
			questionnaire = questionnaire + "<reponse type='texte'>"+ (document.getElementById('reponse'+i+'').value) +"</reponse></questionnaire>\n";
		}
		else
		{
			if(typeReponse == 'image')
			{
				questionnaire = questionnaire + "<reponse type='image'>"+ (document.getElementById('reponse'+i+'').value) +"</reponse></questionnaire>\n";
			}
		}
		alert(questionnaire);
	}
	document.getElementById("message").setAttribute("value", questionnaire);
 
 
}
function typeQuestion(selection, i)
{
 
	if(selection == 'texte')
	{
		texte = "<div class='form-group'><label class='control-label col-sm-2' for='question'>Question "+ i +" : </label><div class='col-sm-7'><input class='form-control' type='text' id='question"+ i +"' name='question"+ i +"''></div></div>";
		document.getElementById("typeEcriture"+i+"").disabled=true;	
		afficheR = document.getElementById("texte"+i+"[]");
		afficheR.innerHTML = texte;
	}
	else
	{
		if(selection == 'image')
		{
			image = "<div class='form-group'><label class='control-label col-sm-2' for='question'>Question "+ i +" : </label><div class='col-sm-7'><input class='form-control' type='file' id='question"+ i +"' name='question"+ i +"''></div></div>";
			document.getElementById("typeEcriture"+i+"").disabled=true;	
			afficheR = document.getElementById("image"+i+"[]");
			afficheR.innerHTML = image;
		}
	}
}
function typeReponse(selection, i)
{
	if(selection == 'texte')
	{
		texte = "<div class='form-group'><label class='control-label col-sm-2' for='reponse"+ i +"'>R&eacuteponse : </label><div class='col-sm-7'><input class='form-control' type='text' id='reponse"+ i +"' name='reponse"+ i +"'></div></div><br/><br/>";
		document.getElementById("typeEcritureRep"+i+"").disabled=true;	
		afficheR = document.getElementById("texteRep"+i+"[]");
		afficheR.innerHTML = texte;
	}
	else
	{
		if(selection == 'image')
		{
			image = "<div class='form-group'><label class='control-label col-sm-2' for='reponse"+ i +"'>R&eacuteponse : </label><div class='col-sm-7'><input class='form-control' type='file' id='reponse"+ i +"' name='reponse"+ i +"'></div></div><br/><br/>";
			document.getElementById("typeEcritureRep"+i+"").disabled=true;	
			afficheR = document.getElementById("imageRep"+i+"[]");
			afficheR.innerHTML = image;
		}
	}
}

Le fichier creation.php :

Code php :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
	if(isset($_POST['message']))
	{
		$matiere = $_POST['matiere'];
		$annee = $_POST['annee'];
		$message = $_POST['message'];
		$files = glob("../xml/".$matiere.$annee."_*.xml");
		$file = "../xml/".$matiere.$annee."_".(count($files)+1).".xml";
		$fileopen = fopen("$file", "a");
		fwrite($fileopen, $message);
		fclose($fileopen);
		header("location: ../../index.php/accueil");
	}
?>

Je ne m'attends pas à ce que quelqu'un s'amuse à lire tout le code je l'ai mis juste à titre informatif. Je veux surtout savoir si c'est possible car j'ai cherché sur internet et je n'ai rien trouvé sur le sujet je commence à croire que je vais devoir chercher un autre solution.

En espérant que vous puissiez m'aider.
Cordialement
Bloxas

[SylvainPV]

Il existe l'attribut multiple sur <input type="file" multiple>. Mais ce n'est pas supporté partout.
Le mieux est que tu partes d'une bibliothèque JavaScript existante pour gérer les transferts multiples en parallèle.

Bibliothèques:
http://resumablejs.com/
http://www.uploadify.com/
https://www.quora.com/What-is-the-be...multiple-files

Tuto sans bibliothèque (en anglais) :
http://robertnyman.com/2010/12/16/ut...ultiple-files/

[Bloxas_]

Merci je test ça lundi à la première heure et je vous tiendrai au courant.

[ABCIWEB]

Salut,

Sinon pour avoir une solution ajax/php prête à l'emploi tu peux utiliser ce module d'upload ajax.

Il y a plus d'une douzaine d'exemples dont deux customisés, et tous fonctionnels avec php côté serveur. En moins de trois minutes tu peux donc faire tes premiers tests, suffit de dézipper le dossier en téléchargement, le transférer sur ton serveur et c'est tout

C'est basé sur le même principe que les lib citées plus haut avec l'utilisation des techniques de fragmentation (chunk) et queing pour surpasser les limitations serveur concernant la taille et le nombre de fichiers uploadés.

- De nombreuses informations possibles en temps réel : nom, taille, progression, temps restant, vignette si le fichier est une image, etc.
- Classes prédéfinies pour définir les retours d'information sans programmation javascript.
- Styles événementiels pour gérer l'affichage des informations en temps réel sans programmation javascript.
- Fonctions javascript événementielles pour des besoins plus avancés.
- Système de sauvegarde automatique pour les gros fichiers : en cas d'arrêt du téléchargement d'un fichier, volontairement ou suite à une panne internet ou serveur ou électrique, le visiteur peut re soumettre le même fichier et utiliser la partie déjà sauvegardée.

La classe javascript pourrait être utilisée avec d'autres langages serveur mais c'est beaucoup plus facile avec php puisque qu'une classe et des exemples d'upload php sont déjà installés pour rendre les exemples directement fonctionnels.

Parmi les exemples fournis on trouve :
- Upload multiple multiple (plusieurs fichiers dans plusieurs champs d'upload).
- Retour du nouveau nom du fichier si celui-ci à été renommé suite à un doublon sur le serveur, ou en variante information avant l'upload de l'existence de doublon sur le serveur (ces fonctionnalités sont implémentées dans les boites de téléchargement customisées).
- Upload avec redimensionnements d'images côté serveur et système de gestion des erreurs fatales possibles (memory_limit, max_execution_time etc.).
- Recadrage (crop) côté client avec le plugin "imgareaselect" installé, suivi d'un upload, recadrage et optionnellement redimensionnement côté serveur. Supporte le crop multiple et mutiple multiple. Donne également un exemple de champ additionnel pour chaque fichier qui pourrait contenir une légende ou un titre...
- Et bien d'autres...

[Bloxas_]

Bonjour et merci de votre aide.

J'utilise le module proposé par ABCIWEB mais je suis confronté à un problème. J'ai réussi a faire ce que je voulais quand mes <input type="file" name="upload_1"/> sont écrit sur ma page php. Mais j'ai aussi des <input type="file" name="upload_1"/> qui sont généré dynamiquement par mon js et dans ce cas les images ne sont plus prise en compte dans la prévisualisation et tout le reste après.

[ABCIWEB]

Salut,

Faudrait nous dire exactement et précisément comment fonctionne ton système du point de vue de l'utilisateur. Que doit-il faire et dans quel ordre, à quel moment ajoute-t-il des fichiers dynamiquement en js ?
C'est une même série de formulaire qui se répète ? Pour te donner une solution il faudrait que je comprenne ce que tu veux faire .

[Bloxas_]

mon sélectionne une option dans un select ce qui donne accès a un autre select qui lui même donne accès a un autre ( le tout dynamiquement en js ). Ensuite l'utilisateur a un autre select ou il choisis texte ou image. Si il choisis image alors un input type file apparaît. Cet input type file peut être créé au maximum cents fois. En regardant le code j'ai trouvé que la ligne. Apres quelques recherche j'ai trouvé que les input type file généré après que la ligne up.Start() soit exécuté ne sont plus considérer comme les autres.

[ABCIWEB]

Et pourquoi ne permets-tu pas l'upload multiple plutôt que de rajouter des input dynamiquement ?

[Bloxas_]

je ne met pas de input multiple car pour l'utilisateur c'est beaucoup moins pratique il devrai sélectionner toutes les images quil veut au meme moment alors que la il peut le faire au fur et a mesure. De plus pour moi ça va etre encore plus dur de savoir quelle image correspond a quelle reponse

[Bloxas_]

c'est bon j'ai trouvé une solution, je créé tous mes input en même temps mais je les mets invisible. Par la suite quand j'ai besoin de l'un d'entre eux je le remet visible et je le déplace à l'endroit voulut. Cette solution prend plus de ressource vu que je créé 40 ou 100 input tout le temps mais c'est la seul solution qui marche et ou je n'ai pas besoin d'aller toucher au code de UploadAjaxABCI.js.

J'ai une autre question. Comment je peux modifier le nom de mon image dans mon dossier je voudrait qu'elle ai le nom rentré dans plusieurs variable.

Edit :
le action de mon formulaire ne se lance plus, c'est normal ? peut etre qu'il y a une fonction qui le désactive. ( je n'ai que un seul bouton submit )

[ABCIWEB]

Salut,

Pour modifier le nom des images côté php tu récupère le nom du fichier nettoyé avec : $nom_fichier_nettoye = $up->getCleanFileName();. Ensuite tu crée une adresse complète de destination avec "$destination = repertoire/nouveau_nom" que tu passeras comme paramètre à la fonction Transfert : $transfert = Transfert($destination);.

Si tu veux utiliser le nom du fichier original, plutôt que d'utiliser la méthode "getCleanFileName()" utilises $nom_fichier_original = $up->getParam('name'); mais fais attention de le traiter pour que le nom du fichier final ne comporte pas de caractères interdits pour le système de gestion des fichiers du serveur.

Le bouton de soumission du formulaire est désactivé par la classe javascript durant la soumission du formulaire et réactivé à la fin du traitement du formulaire. Mais comme il est désactivé sur l'événement "on submit" en aucun cas cela peut empêcher la soumission du formulaire, ou alors c'est qu'un traitement est en cours et non terminé.

Sinon concernant la logique de conception de ton formulaire, j'ai un peu l'impression que tu monte une usine à gaz. L'utilisateur risque de mettre des plombes à remplir toutes les questions du formulaire, et pour peu qu'il télécharge des dizaines de fichiers de plusieurs méga chacun, le formulaire va mettre pas mal de temps pour tout télécharger. Techniquement cela ne pose pas de problème mais il faut prévoir le code pour qu'une erreur durant le transfert (problème de transmission internet par exemple) ne crée pas d'incohérence dans tes données.

J'ai pas toutes les données du problème mais dans ce cas je pense que j'utiliserais une série de formulaire, un par question ou par groupe de question, que l'enverrais automatiquement quand on passe à la question ou groupe de question suivante. Tu pourrais créer une écoute (Deferred avec jquery) pour envoyer automatiquement le formulaire suivant une fois que le premier est fini.

La cohérence des données serait beaucoup plus facile à gérer, et des données pourraient être téléchargées pendant que le visiteur continue à remplir la suite de son formulaire. Si tu ajoute des input de type file dynamiquement en javascript il faut instancier la classe dynamiquement en javascript après que l'input soit inséré. Normal puisqu'elle cherche les champs de type file présents dans le formulaire.

[Bloxas_]

Mon site permet de gérer des qcm ( répondre a plusieurs qcm dans plusieurs matières et pour des années différentes, on a ensuite différentes stats sur ces qcm ). Actuellement je m'occupe de la création des qcm. L'utilisateur choisis donc la matière puis l'année et enfin le nombre de question ( 20 ou 50 ). Ensuite une série d'input apparaît ( un pour la question 5 pour les différents choix, des boutons radio pour dire qu'elle est la bonne réponse et une explication sur la bonne réponse ) Mes qcm étant sur des sujets tels que les maths je ne peut pas demandé a mon utilisateur d'écrire les formules en langage mathématique car le fichier xml ou sera enregistré ces données ne peut pas contenir ces caractères. j'ai donc besoin pour chaque question et chaque réponse d'avoir la possibilité de mettre une image ( de quelques ko ). Une fois toutes les questions renseigné l'utilisateur valide le formulaire, un fichier xml se créé, et les différentes images s'enregistre dans un dossier avec comme nom : matiere_année_numQuestionnaire_numQuestion ( numQuestionnaire correspond au nombre de questionnaire de la même matière et de la même année +1 ). Ce nom sera aussi écrit dans mon xml avec l'extension de l'image derrière.

Voila j’espère que c'est plus clair. C'est peut être pas la meilleur façon de traiter mon problème mais c'est comme ça que je l'ai pensé.

Pour ce qui es du submit je ne comprend pas car il n'y a aucun traitement en cour. Car même si je rempli aucun champ, si je ne met aucune image rien ne se passe. La fonction onclick submit marche parfairement mais le action de mon formulaire ne veut pas du tout se lancer.

En tout cas merci de m'aidé.

[ABCIWEB]

Salut,

C'est de l'ajax donc évidemment l'attribut action du formulaire est désactivé. Toutes les données (input) du formulaire sont transmises (automatiquement) en ajax vers le fichier de destination de la requête ajax de la classe d'upload. Pour les récupérer il suffit de faire $value = urldecode($_POST['value']);. C'est donc dans ce fichier que tu dois faire ton traitement php, pas seulement l'upload mais aussi tout le reste.
C'est pas un problème car par défaut la classe javascript est configurée pour envoyer le formulaire même en l'absence d'envoi de fichiers (il faut configurer l'option "config.submitWithoutFile" = false pour interdire l'envoi du formulaire en absence de fichiers, et par défaut elle vaut true).

EDIT: côté php (fichier de destination ajax) pour récupérer le nom de l'input file - qui devra donc être différent pour chaque question afin de faire l'association question->fichier - tu pourras faire : $name_input_file = $up->getParam('input_name');.

Techniquement même si c'est invisible pour le visiteur la classe javascript fera au minimum une requête pour chaque fichier. Bien penser que toutes les données de type non file sont envoyées à chaque tour de boucle de la requête ajax. Eventuellement si besoin il y a une option javascript .config.queryFormEnd que tu peux configurer à true pour envoyer une requête ajax additionnelle vers le serveur afin d'indiquer à ton script serveur la fin de traitement de tous les fichiers et donc du formulaire.

Si tu veux faire tout le traitement en une seule fois, cette technique ajax de queing (que réalise automatiquement cette classe javascript) est d'ailleurs indispensable car à moins que tu ne dispose d'un serveur dédié, les serveurs mutualisés sont configurés par défaut avec max_file_uploads = 20 soit un maximum de 20 fichiers.

[Bloxas_]

Bonjour,

Ma question est surement très bête mais je préférè demander avant de faire des bêtises : "le fichier de destination de la requête ajax de la classe d'upload" je trouve ça ou ? je commence a me perdre :s Si j'ai bien comprit une fois dans ce dossier je fais

Code :

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

$value = urldecode($_POST['mon_parametre']);

pour chacun de mes paramètres utiles et j'utilise ces valeur pour renommer les fichiers télécharger ( je sais pas ou je fais ça non plus )
ou alors je peux ne pas renommer mes fichiers mais dans ce cas il peut y avoir plusieurs iamges du même nom ce qui pose encore d’autres problème


edit: c'est bon j'ai trouvé le dossier de destination il était sous ma souris :)

[ABCIWEB]

Dans chaque fichier d'exemple, regarde le code source.

En haut de la page du fichier "UploadAjaxABCI_Custom.php" le premier commentaire est

Utilise le fichier "Php_Upload/UploadAjaxABCI_Php_Load.php" comme destination ajax

Oui tu récupères tes valeurs de cette façon dans le fichier de destination ajax (côté serveur) et tu en fais ce que tu en veux.

Quand je parle des options de configuration javascript ça se situe dans le fichier côté client, celui ou se trouve le formulaire (regarde le code source).

Côté serveur (fichier de destination de la requête ajax) c'est une classe php qui prend le relais pour récupérer les valeurs envoyée par la classe javascript.

J'ai édité mon précédent message en ajoutant des informations qui pourraient t'être utiles

et sinon pour ton exemple logiquement ce serait plutôt $mon_parametre = urldecode($_POST['mon_parametre']);

[Bloxas_]

Donc dans mon cas le fichier de destination est UploadAjaxABCI_Php_Load_Crop_multiple.php

J'ai rajouté dans ce fichier mon code pour créé mon xml et ça marche.

Pour ce qui est de renommer le fichier je vois $nom_fichier_nettoye = $up->getCleanFileName(); et $nom_fichier_originel = $up->getParam("name");

Si j'ai bien comprit $nom_fichier_nettoye me retourne fichier.extension et $nom_fichier_originel me retourne c://fakepath/fichier.extension

J'ai tenté de mettre le nom que je veux donner dans $nom_fichier_nettoye en écrivant : $nom_fichier_nettoye = $matiere."_".$annee."_".(count($files)+1) mais j'ai une erreur d'extension.

Si je rajoute $name_input_file = $up->getParam('input_name'); j'ai l'erreur : Echec. upload_quest{"resultat":"upload_ok","ok":"T\u00e9l\u00e9chargement ok"}


EDIT :
J'ai trouvé :

Code :

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

1
2
3
4
 
$nom_fichier_nettoye = $up->getCleanFileName();
$extensionImage = split("[.]", $nom_fichier_nettoye)[1];
$nom_fichier_nettoye = $matiere."_".$annee."_".(count($files)+1).".".$extensionImage;

[ABCIWEB]

Le nom du fichier nettoyé comporte déjà une extension qu'il ne faut pas changer si tu veux que le fichier reste valide. A vrai dire tu peux tout changer sauf l'extension.

Dans le fichier serveur "UploadAjaxABCI_Php_Load_Redimensions_optimise.php" il y a des exemples pour renommer le nom des fichiers. Dans ces exemples j'ajoute un suffixe "min", "max" etc au nom du fichier nettoyé mais tu peux faire ce que tu veux, y compris ne pas te servir du nom du fichier et créer un nom totalement différent tant que tu gardes la bonne extension (extension que tu pourras donc récupérer à partir du nom du fichier nettoyé ou du nom du fichier original, c'est comme tu veux).

[ABCIWEB]

J'ai vu ton Edit, mais je te conseille plutôt d'utiliser "pathinfo" comme dans l'exemple mentionné dans mon précédent message. Ta solution ne fonctionnera pas s'il existe un point dans le nom du fichier et les points sont des caractères autorisés dans le nom des fichiers.

[Bloxas_]

Merci mais c'est bon je viens de réussir j'ai pas mal galérer mais j'ai enfin réussi a faire ce que je voulais. Me reste plus qua mettre le meme nom dans mon xml mais ça devrai se faire vite.

Voici mon code si ça intéresse quelqu'un.

PHP :

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
 
<form class="form-horizontal formajaxabci" method="post" role="form" id="cropsmm" accept-charset="utf-8" name="formulaireAjout" action="#">
					<fieldset style="color:#666;border:2px solid #666;border-radius:5px;padding:1em">
						<legend>Extensions jpg, jpeg, png, gif</legend>
						<div class='form-group'>
							<div class='col-md-12'>
								<select  class="form-control" id="matiereSelect" name="matiereSelect" onchange="matiere(this.value)">
									<option>Choisir une mati&egravere</option>
									<option value="anglais">Anglais</option>
									<option value="culture">Culture g&eacuten&eacuterale</option>
									<option value="francais">Fran&ccedilais</option>
									<option value="raisonnement">Raisonnement et logique</option>					
								</select>
							</div>
						</div>
						<span id="annee[]"></span>
						<span id="nbQuestion[]"></span>
						<span id="question[]"></span>
						<span id="hiddenAnnee[]"></span>
						<span id="hiddenMatiere[]"></span>
						<span id="inputLesQuestion[]"></span>
						<span id="nbQuestions[]"></span>
						<span id="nbReponses[]"></span>
						<span id="inputLesReponse[]"></span>
						<input type="hidden" value="<?=$UpAbci_uniqidForm?>" name="UpAbci_uniqidForm" />
						<input type="hidden" value="<?=$UpAbci_fragmentSize?>" name="UpAbci_fragmentSize" />					
						<!-- les boutons personnalisés ci-dessous remplaceront les boutons d'upload standards des champs de type file grâce à l'option de configuration "config.customFileSelect" déclarée en javascript plus haut  -->
						<input type = "button" value="Images r&eacuteponses" class="bouton_fichiers"  style='display:none'/>
						<input type = "button" value="Images Questions" class="bouton_fichiers"  style='display:none'/>
						<!-- bloc conteneur des informations, s'affichera avec ou sans fichiers joints -->
						<div class="reponse_form" id="reponse_upload1" style="display:none;margin-top:1em;border-bottom:2px solid #333;padding: 0 1em 1em 1em;" data-upabcicss-select-file="display:block" data-upabcicss-submit="display:block" >
					        <!-- retour d'informations générales du formulaire alimenté par le retour ajax. Le fichier php de traitement (UploadAjaxABCI_Php_Load.php) renvoie actuellement 'Aucun fichier traité' si aucun fichier n'a été soumis. Je laisse le code pour info mais je le désactive car cela fait double emploi avec la fonction "func_FormEnd()" qui renvoie cette même information.
					        <div class="UpAbci_infosServer" style="display:none;font-size:1.3em;" data-upabcicss-infos-server="display:block"></div>
					    -->
					    <!-- Le bloc ci-dessous s'affichera si la valeur de l'option "config.imgPreviewMaxSizeTotal" (définie plus haut dans la configuration de la classe d'upload) est dépassée. Je le fais disparaître à la soumission du formulaire pour que cela ne prette pas à confusion avec le résultat du téléchargement -->
					    <div style="display:none;font-size:1.3em" data-upabcicss-error-img-prev-total="display:inline" data-upabcicss-submit="display:none;">
					    	Poids total de la sélection trop lourd pour permettre la prévisualisation des images
					    </div>
					    <!-- bloc conteneur des informations d'un fichier (sera dupliqué par la classe si upload multiple). -->
					    <div class="UpAbci_infosFile" data-upabcicss-select-file="display:block">
 
					    	<div style="clear:both;margin-top:0.5em">					        	
					    		<div style="margin-top:0.5em;margin-bottom:0.5em">
					    			<p style="min-height:2em;">
					    				<!-- lien arrêt, affiché en transparence 0.5 si résultat (= upload terminé) -->
					    				<span style="cursor:pointer;color:red" class="UpAbci_stop" data-upabcicss-result="cursor:default;opacity:0.5">arrêt</span>    
					    				<!-- nom du fichier -->
					    				- <span class="UpAbci_name"></span>
					    				<!-- taille du fichier -->
					    				<span class="UpAbci_size">0 Mo</span>
					    				<!-- status (en attente, ok, erreur, arrêt) -->
					    				- status : <span class="UpAbci_status" data-upabcicss-result-error="color:red;font-weight:bold"  data-upabcicss-result-stop="color:red;font-weight:bold" data-upabcicss-result-ok="font-size:1.2em">en attente</span>
					    				<!-- sauvegarde résultat partiel --> 
					    				<span style="display:none" data-upabcicss-result-partial="display:inline"> - sauvegardé : </span><span class="UpAbci_backup" style="display:none" data-upabcicss-result-partial="display:inline"></span>                
					    				<!-- progression graphique (s'affichera durant l'upload sauf pour les très petits fichiers ou si une sauvegarde existe avant l'upload) -->
					    				<progress style="display:none" data-upabcicss-remaining-time-after="display:inline"  data-upabcicss-backup="display:inline" data-upabcicss-result="display:none" class="UpAbci_progressionG"></progress>
					    			</p>
					    			<!-- Le bloc ci-dessous s'affichera si la valeur de l'option "config.imgPreviewMaxSize" (définie plus haut dans la configuration de la classe d'upload) est dépassée -->
					    			<p style="display:none;font-style:italic;min-height:2em" data-upabcicss-error-img-prev="display:block" >
					    				(Image trop lourde pour permettre la prévisualisation)
					    			</p>
					    		</div>        
					    	</div>		
					    </div>
					    <!-- on affiche le lien "arrêter tout" uniquement si des fichiers ont été sélectionnés et on l'efface à la fin du traitement du formulaire --> 
					    <div style="display:none;" data-upabcicss-select-file="display:block;margin-top:2em;" data-upabcicss-form-end="display:none">
					    	<span class="UpAbci_stopAll" style="font-size:0.9em;color:red;cursor:pointer">Arrêter tout</span>
					    </div>
					    <!-- pourra s'afficher même si aucun fichier n'a été soumis, ce qui ne serait pas le cas en employant data-upabcicss-upload-end qui signale la fin du traitement des fichiers uploadés -->
					    <!-- span renseigné par la fonction javascript "func_FormEnd" -->
					    <div style="margin-top:0.5em;display:none;text-align:center;font-weight:bold;font-size:1.4em" data-upabcicss-form-end="display:block">
					    	Traitement terminé <span class = "resultat" style="text-align:center;font-size:0.8em;font-weight:normal"></span>
					    </div>
					    <!-- on affiche cette ligne d'information si une sauvegarde est trouvée pour au moins un fichier à la fin du traitement (à noter qu'en cas de téléchargement complet d'un fichier il n'existe plus de sauvegarde)-->
					    <div style="margin-top:1em;display:none" data-upabcicss-backup-end="display:block">
					    	<span style="font-weight:bold">Note : </span>les fichiers partiellement sauvegardés peuvent être complétés pendant 24h suivant la dernière sauvegarde effectuée.
					    </div>
					</fieldset>
				</form>

Javascript

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
 
function envoi()
{
	nbQuestion = (document.getElementById('nbQuestion').value);
	var typeQuestion;
	var typeReponse;
	var questionnaire = "<?xml version='1.0' encoding='ISO-8859-1'?><serie>\n";
	var questions;
	var questionAjax ="";
	var reponses;
	var reponseAjax ="";
 
	questions = $('[id^="inputQuestion_"]:visible');
	for (var i = 0; i < questions.length; i++) {
		var chaine = questions.eq(i).attr('id');
		var numQ = chaine.split('_')[1];	
		questionAjax += '<input type="hidden" value="'+questions.eq(i).val().split('\\')[2]+'.'+numQ+'" name="question*'+i+'">';
		alert(questionAjax);
	};
	questionAjax += '<input type="hidden" value="'+questions.length+'" name="nombreDeQuestions">';
	afficheR = document.getElementById("nbQuestions[]");
	afficheR.innerHTML = questionAjax;
	reponses = $('[id^="inputReponse_"]:visible');
	for (var i = 0; i < reponses.length; i++) {
		var chaine = reponses.eq(i).attr('id');
		var numQ = chaine.split('_')[1];	
		reponseAjax += '<input type="hidden" value="'+reponses.eq(i).val().split('\\')[2]+'.'+numQ+'" name="reponse*'+i+'">';
		alert(questionAjax);
	};
	reponseAjax += '<input type="hidden" value="'+reponses.length+'" name="nombreDeReponses">';
	afficheR = document.getElementById("nbReponses[]");
	afficheR.innerHTML = reponseAjax;
 
	for(i=1; i<=nbQuestion; i++)
	{
 
		typeQuestion =  (document.getElementById('typeEcriture'+i+'').value);
		typeReponse =  (document.getElementById('typeEcritureRep'+i+'').value);
		if(typeQuestion == 'texte')
		{
			questionnaire = questionnaire + "<questionnaire><question type='texte'>"+ (document.getElementById('question'+i+'').value) +"</question>\n";
		}
		else
		{
			if(typeQuestion == 'image')
			{
				questionnaire = questionnaire + "<questionnaire><question type='image'>"+ (document.getElementById('inputQuestion_'+i+'').value) +"</question>\n";
			}
		}
 
		for(j=1; j<=5; j++)
		{	
			if(document.getElementById('choix'+j+''+i).checked)
			{
				questionnaire = questionnaire + "<choix bon='O'>"+ (document.getElementById('choix'+j+i+'').value) +"</choix>\n";
			}
			else
			{
				questionnaire = questionnaire + "<choix bon='N'>"+ (document.getElementById('choix'+j+i+'').value) +"</choix>\n";
			}
		}	
 
		if(typeReponse == 'texte')
		{
			questionnaire = questionnaire + "<reponse type='texte'>"+ (document.getElementById('reponse'+i+'').value) +"</reponse></questionnaire>\n";
		}
		else
		{
			if(typeReponse == 'image')
			{
				questionnaire = questionnaire + "<reponse type='image'>"+ (document.getElementById('inputReponse_'+i+'').value) +"</reponse></questionnaire>\n";
			}
		}
	}
	document.getElementById("message").setAttribute("value", questionnaire);
 
}
function matiere(matiere){
	var now = new Date();
	var annee   = now.getFullYear();
	var choixAnnee = "<div class='form-group'><div class='col-sm-12 col-md-12 '><select id='anneeSelect' name='anneeSelect' class='form-control' onchange='anneeChoix(this.value)'><option>S&eacutelectionner une ann&eacutee</option>";
 
	for(i=2010; i<=annee + 1; i++)
	{
		choixAnnee = choixAnnee + "<option value="+ i +">"+ i +"</option>";
	}
	choixAnnee = choixAnnee + "</select></div></div>";
	document.getElementById("matiereSelect").disabled=true;	
	afficheR = document.getElementById("annee[]");
	afficheR.innerHTML = choixAnnee;
	afficheR = document.getElementById("hiddenMatiere[]");
	afficheR.innerHTML = "<input id='matiere' name='matiere' type='hidden' value='"+ matiere +"'>";
 
}
function anneeChoix(annee)
{
	var nombreQuestion = "<div class='form-group'><div class='col-sm-12 col-md-12 '><select id='questionEcriture' class='form-control' onchange='ecritureQuestion(this.value)'><option>Choisir le nombre de question</option><option value='20'>20</option><option value='50'>50</option></select></div></div>";
	document.getElementById("anneeSelect").disabled=true;	
	afficheR = document.getElementById("nbQuestion[]");
	afficheR.innerHTML = nombreQuestion;
	afficheR = document.getElementById("hiddenAnnee[]");
	afficheR.innerHTML = "<input id='annee' name='annee' type='hidden' value='"+ annee +"'>";
 
}
function ecritureQuestion(nbQuestion)
{
	var question ="";
	var inputR="";
	var inputQ="";
	for(i=1; i<=nbQuestion; i++)
	{
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='question'>Type d'&eacutecriture question :</label><div class='col-sm-9' col-md-9' ><select id='typeEcriture"+i+"' class='form-control' onchange='typeQuestion(this.value, "+i+")'><option>Choisir le type d'&eacutecriture</option><option value='texte'>Texte</option><option value='image'>Image</option></select></div></div>";
		question += '<span id="texte'+i+'[]"></span><div id="image'+i+'"></div>';
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='choix1"+ i +"'>Choix r&eacuteponse n&deg;1 : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='choix1"+ i +"' name='choix1"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix1"+ i +"' name='check"+ i +"'></label></div>";
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='choix2"+ i +"'>Choix r&eacuteponse n&deg;2 : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='choix2"+ i +"' name='choix2"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix2"+ i +"' name='check"+ i +"'></label></div>";
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='choix3"+ i +"'>Choix r&eacuteponse n&deg;3 : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='choix3"+ i +"' name='choix3"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix3"+ i +"' name='check"+ i +"'></label></div>";
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='choix4"+ i +"'>Choix r&eacuteponse n&deg;4 : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='choix4"+ i +"' name='choix4"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix4"+ i +"' name='check"+ i +"'></label></div>";
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='choix5"+ i +"'>Choix r&eacuteponse n&deg;5 : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='choix5"+ i +"' name='choix5"+ i +"'></div><label classe='radio'><input type='radio' class='checkbox' id='choix5"+ i +"' name='check"+ i +"'></label></div>";
		question += "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='question'>Type d'&eacutecriture reponse :</label><div class='col-sm-9' col-md-9' ><select id='typeEcritureRep"+i+"' class='form-control' onchange='typeReponse(this.value, "+i+")'><option>Choisir le type d'&eacutecriture</option><option value='texte'>Texte</option><option value='image'>Image</option></select></div></div>";
		question += '<span id="texteRep'+i+'[]"></span><div id="imageRep'+i+'"></div><br/><br/>';
		inputR += "<div id='divReponse"+i+"'><input type='file' class='form-control' id='inputReponse_"+i+"' name='upload_rep' value='"+i+"' style='display:none'/></div>";
		inputQ += "<div id='divQuestion"+i+"'><input type='file' class='form-control' id='inputQuestion_"+i+"' name='upload_quest' value='"+i+"' style='display:none'/></div>";
	}
	question +="<input id='nbQuestion' name='nbQuestions' type='hidden' value='"+ nbQuestion +"'>";
	question +="<input id='message' type='hidden' name='message'>";
	question +="<div class='form-group'><div class='col-sm-of col-md-of fset-2 col-sm-10 col-md-10 '><button type='submit' id='boutonAjout' class='btn btn-default' onClick='envoi()'>Ajouter</button></div></div>";
 
	afficheR = document.getElementById("inputLesQuestion[]");
	afficheR.innerHTML = inputQ;
	afficheR = document.getElementById("inputLesReponse[]");
	afficheR.innerHTML = inputR;
	Up.Start();
	document.getElementById("questionEcriture").disabled=true;	
	afficheR = document.getElementById("question[]");
	afficheR.innerHTML = question;
}
 
function typeQuestion(selection, i)
{
 
	if(selection == 'texte')
	{
		texte = "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='question'>Question "+ i +" : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='question"+ i +"' name='question"+ i +"''></div></div>";
		afficheR = document.getElementById("texte"+i+"[]");
		afficheR.innerHTML = texte;
	}
	else
	{
		if(selection == 'image')
		{
			var obj = document.getElementById("inputQuestion_"+i+"");
			if(obj.style.display == "block")
				obj.style.display = "none";
			else
				obj.style.display = "block";
			$("#divQuestion"+i+"").appendTo('#image'+i+'');
		}
	}
}
function typeReponse(selection, i)
{
	if(selection == 'texte')
	{
		texte = "<div class='form-group'><label class='control-label col-sm-2' col-md-2'  for='reponse"+ i +"'>R&eacuteponse : </label><div class='col-sm-9' col-md-9' ><input class='form-control' type='text' id='reponse"+ i +"' name='reponse"+ i +"'></div></div><br/><br/>";
		afficheR = document.getElementById("texteRep"+i+"[]");
		afficheR.innerHTML = texte;
	}
	else
	{
		if(selection == 'image')
		{
			var obj = document.getElementById("inputReponse_"+i+"");
			if(obj.style.display == "block")
				obj.style.display = "none";
			else
				obj.style.display = "block";
			$("#divReponse"+i+"").appendTo('#imageRep'+i+'');
		}
	}
 
}

UploadAjaxABCI_Php_Load_Crop_multiple petite partie

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
 
$matiere = $_POST['matiere'];
$annee = $_POST['annee'];
$message = $_POST['message'];
$nombreDeQuestions = $_POST['nombreDeQuestions'];
$nombreDeReponses = $_POST['nombreDeReponses'];
 
$files = glob("../xml/".$matiere."_".$annee."_*.xml");
 
if(isset($_POST['message']))
{
	$file = "../xml/".$matiere."_".$annee."_".(count($files)+1).".xml";
	$fileopen = fopen("$file", "a");
	fwrite($fileopen, $message);
	fclose($fileopen);
}
...............................
$nom_fichier_nettoye = $up->getCleanFileName();
	for($i = 0; $i<$nombreDeQuestions; $i++)
	{
		if(split("[.]",$_POST['question*'.$i.''])[0].".".split("[.]",$_POST['question*'.$i.''])[1] == $nom_fichier_nettoye)
		{
			$numero = split("[.]",$_POST['question*'.$i.''])[2];
			$extensionImage = split("[.]", $nom_fichier_nettoye)[1];
			$nom_fichier_nettoye = $matiere."_".$annee."_question_".$numero."_".(count($files)+1).".".$extensionImage;
		}
	}
	for($i = 0; $i<$nombreDeReponses; $i++)
	{
		if(split("[.]",$_POST['reponse*'.$i.''])[0].".".split("[.]",$_POST['reponse*'.$i.''])[1] == $nom_fichier_nettoye)
		{
			$numero = split("[.]",$_POST['reponse*'.$i.''])[2];
			$extensionImage = split("[.]", $nom_fichier_nettoye)[1];
			$nom_fichier_nettoye = $matiere."_".$annee."_reponse_".$numero."_".(count($files)+1).".".$extensionImage;
		}
	}

Bien sur il faut coupler cela au module d'upload conseiller par ABCIWEB.
Merci de votre aide, je ferme le sujet.

[ABCIWEB]

Oui mais ton code n'est pas à jour :

Je t'ai dit dans mon précédent message d'utiliser "pathinfo" pour récupérer l'extension d'un fichier et pas "split". Outre le fait que tu auras des problèmes si le nom du fichier utilisateur comporte un point, il y a aussi le message de php quand on consulte la doc de la fonction split

Avertissement

Cette fonction est OBSOLETE depuis PHP 5.3.0. Nous vous encourageons vivement à ne plus l'utiliser.

Donc non seulement ton code ne sera pas fonctionnel dans tous les cas mais en plus il risque de ne plus fonctionner du tout dans les nouvelles versions de php quand la fonction split sera supprimée. Autant ne pas faire du code obsolète dès sa création, tu pourras l'utiliser plus longtemps sans avoir à le retoucher.

Ce qui fait qu'il te reste un peu de boulot car je vois que tu es un grand fan de l'utilisation de cette fonction que tu emploies à toutes les sauces. Cela te donneras une petite leçon à savoir qu'il vaut mieux consulter la doc php pour chaque fonction utilisée surtout quand on est débutant, pour éviter ce genre de mésaventure

Tu dis que tu as galéré pas mal, bah c'est normal, la création dynamique de qcm n'est pas des plus simple et il faut quelques années d'expérience professionnelle pour avoir toutes les ficelles nécessaires afin d'envisager les choses sereinement pour ce genre de travail. Déjà il aurait mieux valu prendre des infos sur l'upload avant de commencer ton code, cela aurait été plus simple que de l'intégrer au dernier moment, mais c'est le genre de truc que l'on ne sait qu'avec l'expérience

Enfin bon je vois que tu tiens déjà une solution fonctionnelle, et même s'il reste des maladresses, ça démontre déjà une bonne puissance de travail. Tu as commencé ce matin seulement à mettre le nez dans le code source des fichiers d'exemples et comprendre le fonctionnement et à 15H tu avais terminé en intégrant qcm + crop multiple + upload. C'est pas vraiment ce que j'appelle galérer, bravo et bonne continuation dans la programmation

Au passage étant donné que le module d'upload t'as apparemment bien servi pour résoudre ton problème, prends cinq secondes pour cliquer sur le pouce vert dans le lien de téléchargement du module ici, cela permet d'indiquer aux autres visiteurs qu'ils ne perdent pas leur temps à essayer ce module. Et dans ton cas, en utilisant un exemple de crop multiple déjà fonctionnel côté client et côté serveur, on peut dire que tu en a gagné vraiment beaucoup