[JS] Submit na selecteren bestand

[radem205]

Ha,

Wanneer een gebruiker van mijn website een bestand heeft geselecteerd om te uploaden zou ik graag willen dat het form automatisch wordt gesubmit (dus zonder op een submit knop te hoeven drukken).

Is dit mogelijk met Javascript?

Alvast bedankt.

[djluc]

In principe met de onchange event handler. Weet niet of dat in alle browsers werkt met een file input, dat moet je even testen.

[radem205]

Ok dank je, het werkt nu deels.

Nu heb ik het probleem dat ik wil submitten naar een popup scherm waar de afbeelding daadwerkelijk wordt geupload.

Dit is de code:

code:

<form action="uploadafbeelding.php" method="post" name="uploadform" onsubmit="newWindowForm('uploadform')" enctype="multipart/form-data">
<strong>Afbeelding toevoegen:</strong><br /><input type="file" name="image" onchange="uploadform.submit()" />
</form>

Nu submit ie het form wel wanneer ik een bestand selecteer, maar hij submit naar een popup .

Weet iemand een oplossing hiervoor? Of weet iemand een beter (makkelijke) manier om een afbeelding toe te voegen zonder de hoofdpagina te hoeven refreshen?

Alvast bedankt.

[gvanh]

Je kunt een hidden iframe gebruiken.

Je krijgt dan zoiets als:

HTML:

<form action='uploader.php' target='myframe' enctype='multipart/formdata'>
  <input type='file' name='myfile'/>
</form>
<iframe style='visibility:hidden;' name='myframe'></iframe>

Ik weet niet zeker of dat op die manier werkt, maar het is even om een idee te geven.

[Bitage]

Je hoeft het niet in de popup te laten uploaden, zolang je de gebruiker maar die indruk geeft

Upload gewoon in het normale scherm, eventueel in een hidden iframe zoals hierboven wordt gezegd, en laat gewoon een popup verschijnen. Sluit deze dan weer als je upload klaar is ofzo.

[radem205]

Bedankt. Het werkt, maar wanneer een foutmelding ontstaat bij het uploaden wil ik die graag weergeven, maar omdat die iframe een display: none; heeft wordt deze niet weergegeven.

Hoe kan ik deze foutmelding tonen zonder de iframe te moeten tonen?

En nu wil ik de naam van de afbeelding in een tekstveld zetten die op de normale pagina staat (dus niet in de iframe). Hoe kan ik met javascript die tekstveld aanroepen en de naam van de afbeelding toevoegen?

[Bitage]

Als je de fout kan fetchen in JS, gewoon alert(fetched_error); gebruiken.
Anders kun je de visbility weer aan zetten: document.getElementById('uploadframe').style.visibility = "visible";

[gvanh]

Wat kan er precies allemaal misgaan in de file-upload? Je script kan een error weergeven? Je kan er eventueel voor kiezen om die foutmelding vanuit je serverside script te laten outputten als een JavaScript error. Zoiets als

code:

alert($foutcode);

In dat geval krijgt de gebruiker feedback van het feit dat er iets misgegaan is. En je hoeft je verder niet druk te maken over de foutafhandeling. Maar misschien is dat iets te kort door de bocht.