Avatar billede hkb-x Nybegynder
20. juni 2007 - 11:34 Der er 14 kommentarer og
1 løsning

Bedrer fil upload

Jeg arbejder lidt på en metode til at gøre html upload en smule mere lækkert via <input type="file">. Så jeg vil enligt bare vide 2 ting:

1. Hvordan kan man finde ud af når fil vinduet lukkes

2. Hvordan kan man automatisk åbne filvinduet?

Har prøvet lidt med onfocus og onblur men kan ikke rigtigt få det til at virke...

Nogen der kender til en mulig løsning?
Avatar billede olebole Juniormester
20. juni 2007 - 12:11 #1
<ole>

Opgiv projektet! Du læner dig opad at være bruger nummer 100.000, der stiller spørgsmål om dette emne - og det lader sig ikke gøre.

File-inputtet er uden sammenligning det element, der er flest restriktioner omkring. I tidens løb har der været flere mulige hacks, men de bliver umuliggjort, efterhånden som de bliver opdaget.

Punkt 1 kan du omgå ved at bruge elementets onchange-event - men det er stort set umuligt at scripte mod elementet. Der skal meget lidt til, før at filen ikke bliver overført til serveren.

/mvh
</bole>
Avatar billede horsmark Nybegynder
20. juni 2007 - 19:47 #2
olebole -> har da én i ærmet (ej testet i FF da jeg byggede det for 1½ år siden)

*** advarsel incoming hack ***

Korte træk er det vel at positionere 2 knapper ovenpå hinanden hvor "input-file" er øverst men gennemsigtig...

.file,
.fake-file-button {
position:    absolute;
top:        0px;
left:        150px;
width:        50px;
height:     21px;
background-image: url('/sti/til/en/knap.gif');
}

.file {
filter:    alpha(opacity: 0);
opacity:    0;
z-index:    2;
}

.fake-file-button {
z-index:    1;
}
Avatar billede horsmark Nybegynder
20. juni 2007 - 19:54 #3
mht 1 som olebole skriver
<input type="file" onChange="alert('Vinduet blev lukket')" onClick="this.value=''">
Avatar billede hkb-x Nybegynder
21. juni 2007 - 14:35 #4
stenet... jeg kan godt lave en alert() men onChange men ikke en submit()...
Avatar billede olebole Juniormester
21. juni 2007 - 14:41 #5
hkb-x >> den forstod jeg ikke  =)
Avatar billede horsmark Nybegynder
21. juni 2007 - 14:49 #6
du kan da godt autosubmitte så snart der er valgt en fil...

<input type="file" onChange="if(this.value!='') document.getElementById('mit-form-id').submit()">
Avatar billede hkb-x Nybegynder
21. juni 2007 - 15:29 #7
ahh.. har fikset det så kan godt få onChange til at virke så jeg kan submitte...

@horsmark
Dit hack kan jeg ikke få til at virke da jeg ikke kan trykke på file-inputet hvis noget ligger over det... ellers en rigtigt smart ide ;)
Avatar billede olebole Juniormester
21. juni 2007 - 15:41 #8
horsmark >> det interessante er ikke, om formen kan auto-submittes. Det interessante er, om filen er at finde på serveren ... om de binære data overføres.

- og så må jeg lige udtrykke min respekt. Det er ikke så ofte, jeg møder så modige/ihærdige mennesker som Jer!  ;o)

Jeg har ikke ændret den opfattelse, jeg gav udtryk for i kommentaren:
"File-inputtet er uden sammenligning det element, der er flest restriktioner omkring. I tidens løb har der været flere mulige hacks, men de bliver umuliggjort, efterhånden som de bliver opdaget."

Jeg kan kun sige: At I gider! I græder jo alligevel om et halvt år  =)
Avatar billede horsmark Nybegynder
21. juni 2007 - 19:44 #9
olebole >> well... yes du har ret og der er ingen grund til at smide krudt efter det MED MINDRE man er som jeg - "Alle siger at det kan jeg ikke - derfor MÅ jeg bare få det til at lykkedes"  ...og dét er så mit handicap :-)

hkb-x >> Spild ikke krudt på det med mindre det er vigtigt for din eksistens :-) ...og det er derfor at file-input har z-index højere - derfor virker det... så det er dit z-index der ikke er sat korrekt så (måske)
Avatar billede thesurfer Nybegynder
21. juni 2007 - 19:53 #10
1) olebole har ret :-)
2) Se http://www.quirksmode.org/dom/inputfile.html
Avatar billede thesurfer Nybegynder
21. juni 2007 - 19:54 #11
PS: Læg mærke til billedet under "Screenshot: File input fields in the various browsers"
Avatar billede olebole Juniormester
22. juni 2007 - 12:41 #12
horsmark >> Jeg ved godt, jeg ofte fremstår som 'den gamle, sure mand', der fraråder alle mulige spændende løsninger - men jeg har somregel ret gode grunde  =)

F.eks. husker jeg de mange E-brugere, der for nogle år siden brugte 'Chromeless Windows' i IE ... og ikke mindst deres panik, da browser-bug'en, der gjorde teknikken mulig, blev rettet. Dengang blev der grædt, så snottet hang i guirlander fra skærm til skærm!

Jeg har det skam også med at lege - og gerne på de mest syge måder. Men jeg bruger aldrig tvivlsomme løsninger i ting, der skal på nettet.
Det er mit (ganske ubeskedne) indtryk, at mange E-brugere ikke er helt så velorienterede, som mig - og derfor prøver jeg altid at advare mod ubehagelige overraskelser.

For ingen skal være i tvivl, er essensen i de af mine holdninger, jeg giver udtryk for i denne tråd:
    Leg gerne alt det, du vil - men pas på, hvad du bruger resultatet til
    - og lad være med at bruge kostbar tid på tvivlsomme løsninger, hvis det ikke er leg
Avatar billede hkb-x Nybegynder
11. juli 2007 - 16:00 #13
Dette er et rent eksperiment for at finde noget der holder...

Det er kun til brug på en privat del af min egen side www.hkb.it

Men selvfølgelig har quirksmode som sædvanlig en nice JS løsning...

Tror jeg jeg vil kigge lidt nærmere på...
Avatar billede hkb-x Nybegynder
05. oktober 2007 - 16:28 #14
Har nu strikket noget sammen som passer fint til mine behov...

Hvis nogle vil have point så kast et svar ellers lukker jeg nok om en uge...
Avatar billede hkb-x Nybegynder
03. december 2007 - 12:35 #15
LUKKET
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