Comment soumettre une entrée "fichier" sans soumettre le bouton avec JavaScript?

Question

Il existe un moyen de soumettre automatiquement un formulaire sans cliquer sur un bouton "Soumettre"?

J'ai un formulaire avec une entrée "fichier". Je soumettrais le formulaire après que l'utilisateur ait sélectionné un fichier.

Answer 1

Oui, vous pouvez utiliser la fonction form.submit(). Ajouter un auditeur onchange sur l'entrée de fichier et le lier à la fonction form.submit, comme ceci:

<form action="upload.php" method="post"> 
<input type="file" onchange="this.form.submit()" name="myFile"/> 
</form> 

Answer 2

Je ne crois pas que vous puissiez le faire. Les navigateurs sont très, très stricts sur ce que vous pouvez faire pour classer les champs de téléchargement, en raison de la possibilité d'abus. Si l'utilisateur sélectionne accidentellement un fichier privé, il ne souhaite pas qu'il commence immédiatement à télécharger ce fichier sur un serveur aléatoire.

Answer 3

Oui, vous pouvez ajouter ce qui suit à l'événement onchange de l'entrée du fichier:

<input type='file' .... onchange='this.form.submit();'> 

cela soumet le formulaire juste après que l'utilisateur a choisi un fichier. Cependant, l'utilisateur ne peut pas corriger une sélection erronée avant de la soumettre - assurez-vous de vérifier si cela est vraiment judicieux.

Answer 4

Je ne suis pas sûr de savoir quelles sont les restrictions pour ce faire dans un formulaire HTML.

Vous pouvez cependant le faire avec Flash. Gmail le fait - lorsque je clique sur "Joindre un fichier", une boîte de dialogue de recherche de fichier m'indique, et lorsque je valide cette boîte de dialogue, le téléchargement commence immédiatement et me donne également une barre de progression. Googling pour "Flash uploader" vous donnera beaucoup d'options, mais je n'ai aucune expérience avec l'un d'entre eux.

Answer 5

Cette solution fonctionne pour moi.

<form enctype="multipart/form-data" method="POST" action="/upload"> 
    <input id="myfilefield" type="file" name="file"> 
    <input type="submit"> 
</form> 

 

document.getElementById('myfilefield').onchange = function() { 
    this.form.submit(); 
}; 

Par ailleurs, vous n'avez pas besoin d'utiliser le flash. Gmail le fait par XHR niveau 2.