✔ [jquery] .submit() funktioniert nicht

[dirion]

Hallo zusammen,

folgendes Problem habe ich. Ich habe das Problem, dass .submit() nicht richtig funktioniert

Hier (reduziert) das Formular:

<form action="uploaddocument.php" method="POST" enctype="multipart/form-data" id="uploadfile">
<input type="file" name="file" id="uploaddocument_file" value="Datei" />
<button type="button" name="uploaddocument" id="submitdocument">Datei hochladen</button>
</form>

Mache ich JS folgendes, funktioniert alles problemlos

$('#submitdocument').click( function () {
    $('#uploadfile').submit();
});

Ich möchte allerdings eine Statusbar zum Upload darstellen und muss beim submit also noch etwas ergänzen. Wenn ich allerdings nur folgendes schon probiere, geht gar nichts mehr und ich habe leider keine Idee warum.

$('#submitdocument').click( function () {
    $('#uploadfile').submit(function( event ) {
      alert( "Handler for .submit() called." );
      event.preventDefault();
    });
});

Ich erhalte den Alert nicht.

Ich hoffe Ihr könnt mich auf einen Lösungsweg bringen. Vielen Dank.

 

[jeipack]

Die jQuery Doku ist sehr gut: https://api.jquery.com/submit/

Wenn du .submit() aufrufst dann führt es den Eventhandler der an submit geknüpft ist aus, resp submited das dazugehörige Formular.
Wenn du aber einen Parameter bei .submit() mitgibst dann bindest du einen eventHandler an das Objekt.
Bei deinem Code ist es also so, dass du mit einem Klick auf #submitdocument nur einen eventHandler an #uploadfile anhängst, diesen aber nicht ausführst.

Meiner Meiung müsste dein Code also so aussehen:

$('#submitdocument').click( function () {
alert( "Handler for .submit() called." );
//do something; when its finished call:
$('#uploadfile').submit();
});

Um nun eine Statusbar zu erzeugen würde ich mal nach: "javascript upload statusbar" googlen.

 

[dirion]

Super. Das funktioniert. Vielen Dank auch für die verständliche Erläuterung