Il faut cliquer deux fois sur le bouton d’envoi après avoir défini val () avec jquery lors du téléchargement de fichier personnalisé.

J’essaie de styler un contrôle ASP.NET FileUpload en le cachant et en y ajoutant mes propres contrôles. Je fais ça avec jQuery:

$(function () { $('input[type=file]').each(function () { var fileUpload = $(this); var textBox = $(''); textBox .css('width', fileUpload.width() - 85) .css('margin-right', 5) .prop('disabled', fileUpload.prop('disabled')); var button = $('') .prop('disabled', fileUpload.prop('disabled')); fileUpload.change(function () { textBox.val(fileUpload.val()); }); button.click(function () { fileUpload.click(); }); fileUpload.after(button).after(textBox); fileUpload.hide(); }); }); 

Cela fonctionne fondamentalement très bien, sauf que je dois cliquer deux fois sur le bouton d’envoi dans IE (10). Je ne peux pas reproduire cela dans jsFiddle, mais j’ai créé un projet ASP.NET dépouillé dans lequel cela se produit.

Dans Firefox, je n’ai pas ce problème. Quelqu’un sait où je peux commencer à regarder?

La réponse de Fabi à cette question l’a résolue pour moi. Peut-être, c’est une sorte de fonctionnalité de sécurité, je ne suis pas sûr. Mais en utilisant une étiquette pour le téléchargement du fichier, il vous suffit de cliquer sur l’étiquette une fois.

Vous devrez toutefois appeler l’étiquette comme un bouton. Il y a une bonne explication dans le jsFiddle. Je ne suis pas sûr de la remarque à propos de Mozilla. Cela fonctionne bien dans Firefox pour moi.

Vous ne pouvez pas atsortingbuer de style à FileUpload pour des raisons de sécurité dans IE. En outre, les modifications minimes que vous pouvez obtenir peuvent être différentes dans chaque navigateur.

Une solution proposée par un ami pour mon projet consiste à masquer FileUpload et à lui donner une image. Le concept est de donner l’opacité FileUpload 0 et zindex high ainsi que le bouton zindex low et position absolute.

Voici un exemple de code de notre projet

.NewInvoiceDialog .AspFileUpload {curseur: pointeur; position: absolue; z-index: 1; -moz-opacité: 0,00; opacité: .00; filtre: alpha (opacité = 00); }

.NewInvoiceDialog .stepBlueButtonWrapper.AddInvoiceFile {float: none; z-index: 0; }

.NewInvoiceDialog .stepBlueButtonWrapper.AddInvoiceFile * {z-index: 0; curseur: texte; }