uploading file using ajax submit

Question

I'm trying to upload a file and get the contents in java controller and write it to my specified path.It works when I submit the form as usual but now I want to upload file using ajax submit.I don't know ajax and tried googling but in vain.Please anyone suggest some tutorial or guide me how to do it.

Thank you.

Answer 1

there is no direct way to upload using ajax but one way to simulate using iframe

Please have a look on these discussion

How can I upload files asynchronously? AJAX form submit with file upload

Ajax Style File Uploading using Hidden iFrame

http://viralpatel.net/blogs/ajax-style-file-uploading-using-hidden-iframe/

Answer 2

try this plug in

<script>
    // wait for the DOM to be loaded
    $(document).ready(function() 
    {
        // bind 'myForm' and provide a simple callback function
       $("#tempForm").ajaxForm({
       url:'../calling action or servlet',
       type:'post',
       beforeSend:function()
       {
         alert("perform action before making the ajax call like showing spinner image");
       },
       success:function(e){
        alert("data is"+e);
            alert("now do whatever you want with the data");
       }
       });
    });
</script>

and keep this inside your form

<form id="tempForm" enctype="multipart/form-data">
<input type="file" name="" id="" />
</form>

and you can find the plug in here

if you have mentioned the ecntype in your form then it would pass the filles as byte field , there you have to use

String photo = request.getParameter('inputFile').getBytes();

this byte can be stored as a.blob in sql