Question

I have an HTML form that previously was only used for text attributes for users, that was all using AJAX to call a PHP controller functions via URLs to refresh page content via database and server-side calls (abridged version)

 <input type="text" id="firstname" name="FIRSTNAME"/>
 <input type="text" id="lastname" name="LASTNAME"/>
 <input name="Submit"type="submit" value="Submit" />

This “create user” form now needs to incorporate a file uploading mechanism, for user images

 <input type="file" name="userImage" />

The problem is that the form is being submitted via .serialize in the .ajax #create form submit

        $.ajax({
            url: 'controller.php?command=create',
            type: 'POST',
            data: $( form ).serialize(),

create URL calls the PHP controller echo $dmv->create(); , which is the model public function create(){ //execute database insert and execute

I have read that serialize does not make sense for files, which is true, but I also want to try to figure out how to update my existing form to incorporate file upload functionality to it

I have tried to understand the jquery.form.js plugin ( http://malsup.com/jquery/form/#file-upload ) but cannot understand how to tie it all together.

I believe what I need to do is have the file upload execute as a separate logic, then tie back with the original logic for file name , this is file storage with the unique image name stored in the database under the record, not BLOB image storage.

Let me know if I can provide any further info, and thanks to any help that can be given.

Answer 1

Here is a example of what Michael is talking about. http://www.phpletter.com/Our-Projects/AjaxFileUpload/