Avatar billede ewax Nybegynder
21. oktober 2008 - 13:55 Der er 13 kommentarer og
1 løsning

Styling af input file tag

Hey alle sammen.. nu har jeg i flere år aldrig kunne style det skide file tag.. når jeg laver upload systemer etc. er ved at tro det snart ikke kan lade sig gøre..

og ja, har googlet massere af gange, men aldrig fundet noget jeg kunne bruge?

nu har jeg lavet en ny større internetportal, og den upload form trækker det så meget ned designmæssigt.. help?

er frisk på alle forslag??
Avatar billede ssv Nybegynder
21. oktober 2008 - 14:05 #1
Avatar billede ewax Nybegynder
21. oktober 2008 - 14:11 #2
Har luret en del på den, men det er ikke lige det jeg har brug for, fandt noget her der muligvis kunne bruges

<input type='file' name='browse' style='display:none'>
<input name='file_name'>
<input type='button' onclick='browse.click();file_name.value = browse.value'>

den laver et felt og en knap der åbner samme browser funktion.. dog virker det kun i IE.. hader det crossbrowser lort..

ved ikke om der er nogen der kan fikse det? er ikke så skarp til js..

det kan da virkelig ikke passe man ikke kan style sådan et irriterende tag
Avatar billede erikjacobsen Ekspert
21. oktober 2008 - 14:45 #3
Det burde slet ikke virke. Så du er da heldig at IE ignorerer dine fejl. Du er nødt til adressere dine inputfelter korrekt:

  this.form.file_name.value

(de er vel i en <form> ... </form>), eller ved at give felterne et id og bruge document.getElementById
Avatar billede ewax Nybegynder
21. oktober 2008 - 14:58 #4
nu var det mere browse.click() der ikke virkede?
Avatar billede ewax Nybegynder
21. oktober 2008 - 15:07 #5
Nu har jeg prøvet at lege lidt..

<form method='post' action='#'>
<input type='file' name='browse' style='display:none'>
<input type='text' name='file_name'>
<input type='button' value='Browse' onclick='this.form.browse.click();this.form.file_name.value = this.form.browse.value'>
<input type='submit' value='Upload'>
</form>

den kommer frem med browse vinduet i IE, men ikke i FF. og så skal man submitte 2 gange? :/

hvis jeg kunne få dette til at virke, ville det virkelig hjælpe mig en hel del
Avatar billede erikjacobsen Ekspert
21. oktober 2008 - 15:10 #6
Hehe, nå ja, det kan man ikke. Men du kan gøre som her: http://www.quirksmode.org/dom/inputfile.html  - det er ikke ret meget snyd.
Avatar billede ewax Nybegynder
21. oktober 2008 - 15:37 #7
blir nok os den jeg ender med.. ;) men ville rigtig gerne finde et alternativ ?
Avatar billede erikjacobsen Ekspert
21. oktober 2008 - 15:41 #8
Der er ikke meget man kan, og det har noget med sikkerhed at gøre. Det skal ikke være muligt at snyde sig til at få uploadet en fil. Om IE går over stregen kan diskuteres. Men uanset hvad du får til at virke i dag, kan du ikke være sikker på det virker i morgendagens browsere.
Avatar billede olebole Juniormester
21. oktober 2008 - 19:19 #9
<ole>

Det er en evig kamp mod 'kreative' kodere, men forhåbentlig lukkes denne version af sikkerhedshullet i IE8. File-inputtet _må_ ikke kunne ændres - så har man tvingende brug for det, er det fordi, man har valgt den forkerte teknologi  ;o)

/mvh
</bole>
Avatar billede ewax Nybegynder
28. oktober 2008 - 12:59 #10
olebole, hvad er alternativet til html da? det er lidt svært at opbygge et webinterface uden..

Jeg syntes personligt det er utroligt skidt at man ikke kan style et skide input file tag i 2008. oldtids teknologi
Avatar billede erikjacobsen Ekspert
28. oktober 2008 - 13:15 #11
...men med moderne overvejelser omkring sikkerhed. Vil du hellere have lænset din bankkonto for penge? ;)
Avatar billede ewax Nybegynder
28. oktober 2008 - 14:20 #12
Hvilke penge? hehe ;)

Nå tænkte jeg bare at man skulle kunne smide noget style på et file input som man kan gøre på input text fx, bare lidt border og bg fis
Avatar billede ewax Nybegynder
04. november 2010 - 15:38 #13
nå, blev sgu ikke klogere :)

nogen der vil have points for deres tid? ellers lukker jeg ned her
Avatar billede ewax Nybegynder
18. august 2011 - 20:36 #14
lukker ned
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester