Afficher un formulaire différent suivant le choix dans une liste

Canonier
Javascript

Bonjour à tous,

Voila le problème qui m'occupe :
Je veux proposer aux utilisateurs de mon site d'uploader un fichier. Et je souhaiterai avant qu'apparaisse le formulaire d'upload, que l'utilisateur choisisse dans une liste déroulante le type de fichier à uploader (image video etc..), et qu'ensuite, suivant le choix, apparaisse le formulaire correspondant.

J'imagine que jquery va bosser, mais je ne sais pas du tout le manier.. load() ?

Si vous avez une idée.. MERCI :D

10 réponses

Maenhyr
Réponse acceptée

Ok en fait tu as deux choix, soit un fichier, soit un lien.

Tu peux faire deux choses :

A. Tu proposes ton select puis deux inputs (un texte pour le lien, et l'autre en file pour le fichier). Cela va permettre à l'utilisateur de mettre un lien pour ton fichier son par exemple. Ca peut être utile. Le select va servir pour le test du lien ou du fichier en back end.

B. Tu Proposes que ton select. Lorsque le valeur de ton select est bonne, tu affiches soit le lien, soit l'input file. http://jsfiddle.net/gYsjv/1/. Cet exemple est simplifié à l'extrème mais tu vas pouvoir l'adapter à ton besoin.

Maenhyr

Salut,

petite question, pourquoi avoir besoin d'un select permettant le choix d'un type de fichier ? Un input type file prend n'importe quel format en entrée.

Canonier
Auteur

En faite c'est parce que suivant le type d'upload, j'ai besoin d'avoir différentes données.

Pour illustrer :

  • wallpaper (image quoi), je dois uploader le fichier donc input file etc.. + nom
  • video (ici je veux l'url yt), je dois récupérer une adresse youtube
  • skin (fichier zip -pour un jeu-) upload comme wallpaper + nom (mais envoyer ailleurs sur le serveur)
  • maps (fichier gbx -pour le jeu-) adresse d'un site ou la map est déjà uploadée + nom (j'ai pas accès a la bdd du site en question)
  • etc..

Bref pour résumer, aucun type n'est traité de la même manière.
d'où ma volonté d'afficher un formulaire différent suivant le choix dans une liste.

Maenhyr

A ta place j'aurais fais un input file unique qui prend n'importe lequel de tes fichiers. Le select servira en backend pour tester si le fichier est dans le bon format par rapport à ce qui est demandé.

Canonier
Auteur

Ouais, j'y ai pensé, mais j'aurais espéré faire autrement.. (
Donc mon problème n'a pas de solution x) ?

Maenhyr

Si il y a moyen de placer autant d'input file que de type de media et de ne les afficher que suivant le choix d'un select mais d'un point de vue utilisateur comme sécurité je doute que ça soit la bonne manière de le faire.

Même avec un input file unique, tu peux toujours faire une détection basique du fichier en JS. L'avantage c'est que tu n'ajoutes pas des champs qui ne sont pas nécessaire. Par ailleurs, tu auras moins de code à écrire si tu décides d'ajouter un nouveau media. Il faut garder ton code le plus simple possible pour avoir une faible maintenance et une plus grande sécurité. Ça ne veut pas dire que tu ne peux pas te permettre des effets côté utilisateur.

Canonier
Auteur

Okay !!
Donc je dois laisser aux utilisateurs des champs vides..
c'est qui me dérange.
pour la sécurité, ce formulaire n'est accessible qu'aux admin du site.. donc je ne pense pas qu'il y est de failles.

Maenhyr

Je ne suis pas sûr de comprendre ton réel besoin ? Quels sont les champs à masquer ? Peux tu faire un dessin ?

Canonier
Auteur

Je rappelle que c'est pour un jeu (trackmania) où les utilisateurs partagent des fichiers (le formulaire est sécurisé).

donc soit c'est une upload de fichier, soit c'est simplement un input.

donc pour faire simple, comment en partant de ca :

on peut arriver a un formulaire différent ^^

Canonier
Auteur

Parfait !! Merci !