Créer plusieurs fichiers de téléchargement dynamiquement

Je me demandais si quelqu'un connaissait la meilleure façon de créer dynamiquement un formulaire de téléchargement?Créer plusieurs fichiers de téléchargement dynamiquement

Voici ce que j'essaie de réaliser: Le code ci-dessous permet un téléchargement, je veux avoir un bouton qui, lorsqu'il est pressé, devrait ajouter un autre formulaire pour le téléchargement de fichiers. Donc, si je veux télécharger - disons 7 fichiers, je veux appuyer sur le bouton 7 fois pour créer ces formulaires de téléchargement, chacun sur sa propre ligne.

Y at-il de toute façon que je peux le faire?

Merci pour votre aide:

<html> 
    <head> 
     <title> Multiple File Uploads </title> 
    </head> 
    <body> 
     <form enctype="multipart/form-data" action="uploader.php" method="POST"> 
      Choose a file to upload: <input name="uploadedfile" type="file" /><br /> 
      <input type="submit" value="Upload File" /> 
     </form> 
    </body> 
</html>

Source

2009-06-22 Anonymous

Habituellement vous faites quelque chose comme ça, côté client:

<div id='Uploadcontainer'> 
    <input type='file' name='uploadfiles[]' class='uploadfile' /> 
</div> 
<button id='extraUpload'>Add another field</button> 
<script type='text/javascript'> 
    $('#extraUpload').click(function(){ 
     $('.uploadfile:last').clone().appendTo('#uploadContainer'); 
    }); 
</script>

qui utilise jQuery. Ensuite, sur le côté du serveur, vous pouvez facilement en boucle sur le $ _FILES [ « uploadfiles »] tableau:

foreach($_FILES['uploadfiles'] as $file){ 
    //do stuff with $file 
}

Source

2009-06-22 09:50:19

C'est une ligne très prometteuse à suivre, merci Pim pour ce super morceau de code. Je vais continuer à partir de là. Si je frappe un mur, je vais vous donner un cri. Vous avez été très bons - restez bénis et bonne chance :) –

jeter un oeil ici pour un exemple simple

http://mohamedshaiful.googlepages.com/add_remove_form.htm

Josh

Source

2009-06-22 09:35:18 Josh

Merci Josh pour la réponse très rapide. Je vois que la solution utilise JQuery, et je ne l'ai jamais utilisé auparavant. Alors, se demandait s'il était également possible d'atteindre le même résultat sans utiliser de framework tiers? –

jQuery a un joli plug-in que je l'ai utilisé appelé MULTIFILE. Vous voudrez peut-être vérifier cela.

http://www.fyneworks.com/jquery/multiple-file-upload/

Source

2009-06-22 09:37:12 tschaible

Hey tschaible, merci pour l'indice aussi. Est-il possible de réaliser la même chose sans utiliser JQuery ou d'autres frameworks? –

Vous pouvez essayer ce plugin jQuery appelé uploadify Vous pouvez essayer YUI uploader

Assurez-vous que vous gérez correctement le fichier sur le serveur que Flash publie parfois les données sur le serveur dans différents façons. Donc, si vous avez un moyen de vérifier ce qui est dans les valeurs de la demande, alors vous devriez être bon.

Source

2009-06-22 09:38:47 superlogical

Il n'y a aucun moyen de le faire avec en HTML brut. Je pense qu'il commence à être abordé dans les dernières versions des navigateurs et la prochaine spécification HTML5.

La plupart des solutions multi-navigateurs actuelles nécessiteront une bibliothèque JS (et je pense que Flash). L'alternative consiste à sélectionner chaque fichier individuellement avec son propre élément d'entrée. Pour des raisons évidentes, les navigateurs implémentent une sécurité très stricte autour des scripts et de l'affichage des éléments de téléchargement de fichiers qui peuvent rendre leur travail difficile.

Source

2009-06-22 09:50:54 edeverett

Voici une vraiment très simple, fonctionne dans FireFox, Chrome et IE7. Je vous conseille vraiment de consulter un framework javascript tel que jQuery, ça va vous simplifier la vie.

<div id='Uploadcontainer'> 
<input type='file' name='uploadfiles[]' class='uploadfile' /> 
</div> 
<button id='extraUpload' onclick="return addAnother('Uploadcontainer')">Add another field</button> 
<script type='text/javascript'> 
function addAnother(hookID) 
{ 
    var hook = document.getElementById(hookID); 
    var el  = document.createElement('input'); 
    el.className = 'uploadfile'; 
    el.setAttribute('type','file'); 
    el.setAttribute('name','uploadfiles[]'); 
    hook.appendChild(el); 
    return false; 
}

Source

2009-06-22 12:20:28 M4rk

Créer plusieurs fichiers de téléchargement dynamiquement

Répondre

Questions connexes