Drop av filer i IE

[a-tokle]

Jeg ønsker å lage en web-side der man kan dra en fil fra utforsker og slippe på et bilde i en web-side, og da kunne fange opp filnavnet med javascript kode eller DHTML kode. Finner eksempler der man kan dra og slippe elementer fra IE til IE, men ikke noe der man kan dra noe fra utforsker til IE. Er det noen som har noe forslag.

 

At.

[Kirikiri]

Du kan lage en span med contenteditable = true, droppe bildefilen i denne, og bruke javascript ved submit til å hente ut html-koden. Denne vil i så fall vise img src=filnavnet ditt. Gjør litt trimming av html-resultatet, og så har du filnavnet.

 

Denne biten henter inn html-versjonen av det som står i spnContent, og legger det i txtContent, som er hidden. __aspnetForm = formname. Generert i .net, som lager litt lange form-navn...

  
<script language="javascript">
function CheckForm()
{
//fyller inputfelt med innhold fra span
__aspnetForm.txtContent.value = document.getElementById('spnContent').innerHTML;
}   
</script>

 

Disse er altså hidden, og fylles når du trykker på submit. Mulig disse kan settes til en annen type, og vises direkte.

<input type="hidden" name="txtContent" />

 

Slik setter du opp spans som er editerbare, dvs contenteditable="true". Dette fungerer i IE, men ikke i så mange andre browsere. Men siden du sa at du ville bruke IE, så er det ikke noe problem i dette tilfellet.

<span id="spnContent" contenteditable="true" style="background-color:white;BORDER-RIGHT:#cccccc 1px solid; BORDER-TOP:#cccccc 1px solid; BORDER-LEFT:#cccccc 1px solid; WIDTH:100%; BORDER-BOTTOM:#cccccc 1px solid; HEIGHT:400px">
</span>	

 

Her er standard submit-knapp, som trigger javascriptet.

<input type="submit" name="_ctl0:btnInsert" value="Lagre" id="_ctl0_btnInsert" onclick="javascript:return CheckForm();" />

 

Avhengig av hva du koder det i, så er det kanskje greit å gjøre behandlingen i denne rekkefølgen:

Dropp bildet

Trykk på submit

Lagre innholdet i span i hiddenfeltet, og post videre

Hent ut innholdet med request.form("txtContent"), f.eks. sMyString = request.Form("txtContent")

Gjør string-manipulering på sMyString

Skriv ut filnavnet med response.write(sMyString)

 

Du kan vel egentlig gjøre alt i selve CheckForm-javascriptet, når du bare har fått hentet inn html-koden fra span.

 

Bruker denne metoden til å lage rik html med bilder til artikler etc. Det går helt fint å droppe inn bilder fra Windows Explorer, dessverre. Har vært en del ganger jeg har måttet be sjefen min om å fikse artiklene sine, når han har trukket ting direkte fra Windows Explorer... (- "Nei, det er ikke så mange som ser bilder med < img src="c:\documents and settings\boss\my pictures\logo.jpg" >....")

 

Kirikiri

[a-tokle]

Takk for utfyllende svar. Jeg skal bruke det for å uploade filer, i stedet for å åpne fil-dialog og plukke fra denne.

 

At.

[Kirikiri]

Så lenge du har filnavnet, kan du kanskje uploade basert på det? Eller?

 

Kirikiri

[a-tokle]

Så lenge du har filnavnet, kan du kanskje uploade basert på det? Eller?

 

Kirikiri

Ja, når jeg har filnavnet har jeg alt jeg trenger. Neste utfordring blir å dra mail fra outlook til IE, men får ta et steg om gangen.