Simple Upload failing

[JohnT]

Play time over, and my boss is making me work. Darn it!

Anyways, I want to display a simple loading indicator in a DIV while file is uploading.

But the page appears to submit to itself, as well as my upload handler.

Any ideas?




<script type="text/javascript">

Upload = function(){

return{

init : function(){

/* Attach Listeners */
getEl("uploadForm").on("submit",Upload.sendFiles, Upload);

},

fileSuccess : function(o){

alert("Done");

},

fileFailure : function(o){

alert("FAILED");

},

sendFiles : function(){

/* Make sure there is at least one file */
// TO DO:

/* Begin Upload Transaction */
getEl("UploadStatus").setStyle("display","block");
getEl("StatusSpan1").setStyle("display","block");

var callback =
{
success: Upload.fileSuccess(o) ,
failure: Upload.filefailure(o)
}
// argument formId can be the id or name attribute value of the
// HTML form, or an HTML form object.
var formObject = getEl('uploadForm');

// the second argument is true to indicate file upload.
YAHOO.util.Connect.setForm(formObject, true);

var cObj = YAHOO.util.Connect.asyncRequest('POST', 'application_upload.php', callback);

}

};


}();

YAHOO.ext.EventManager.onDocumentReady(Upload.init, Upload, true);

</script>

[tryanDLS]

The declaration of your callack object is immediately calling your sucess and failure methods rather than just declaring them b/c you said upload.filesuccess(o).

Edit: you're hooking to the submit event it looks like, but are you preventing the page from actually submitting itself?

[JohnT]

Do I need to prevent the default submit action from taking place? That would make sense.

[tryanDLS]

Yes, make your form element something like


<form id="myid" name="myid" method="POST" action="" onsubmit="return false"></form>


Then rather having a button that does a submit, make it a regular button that starts your upload on click

[JohnT]

cool, thanks Tim. Will give it a shot!