Afficher le nom du fichier avec le nombre de formulaires

J’ai le nombre de formulaires sur une page et chacun a une entrée de fichier. Lorsque l’utilisateur choisit un fichier, je souhaite imprimer le nom du fichier sélectionné dans la qui se trouve dans le formulaire approprié.

Au lieu du champ de saisie pour le programme de téléchargement de fichiers, j’utilise l’image “photoIconOn.png”.

Pourquoi le nom du fichier est-il toujours imprimé dans le premier formulaire / class = “fileNameBox”?

JS:

  $(function() { $('input.file-field').on('change', function(e) { var files = this.files, filename = files[0].name; $(this).closest('form').find('.fileNameBox').html(filename); }); });  

HTML:

  

Eh bien, je vais répondre à cela, même si ce que vous avez devrait fonctionner. Je copie et colle ton code dans un violon et tout fonctionne. La seule chose que j’ai changée, c’est la façon dont j’ai obtenu le nom du fichier car je ne sais pas comment vous le faites en cachant l’entrée du fichier.

Voici un violon https://jsfiddle.net/L5gu9vhL/1/

 

Jquery

 $(function() { $('input.file-field').on('change', function(e) { var filename = $(this).val(); $(this).closest('form').find('.fileNameBox').html(filename); }); });