File is not uploaded and gives me "You did not select a file to upload" when I m using jquery ajax method to call controller function of CI

Question

File is not uploaded and gives me "You did not select a file to upload" error when I m using jquery ajax method to call controller function of CodeIgniter.So please help me to resolve this error and upload file with ajax

//My View : 
<form  id="frm" name="frm" enctype="multipart/form-data">
<input type="file" name="userfile" id="userfile" size="20"/> 
<input type="button" value="upload" id="upload" name="upload"/>
</form>

//calling button live method from view
$('#upload').live("click", function ()
{
//calling jquery ajax
$.ajax({
type: "POST",
url:"../user/usercontroller/do_upload", //calling controller function
cache: true,
success: function(data4)
{ 
alert('in ajax'+data4);
},datatype: "json"
});
});

//My Controller:
function do_upload()
{
$upload_dir ='./uploads/';
$config['upload_path'] = realpath($upload_dir);
$config['overwrite'] = TRUE;    
$config['allowed_types'] = '*';
$config['encrypt_name']  = true;
$config['remove_spaces']  = TRUE;
$this->load->library('upload', $config);
if (!$this->upload->do_upload('userfile'))
{
print_r($this->upload->display_errors());
}    
else
{
print_r($this->upload->data());
}            
}

Answer 1

You cannot upload files using Ajax. If you want it to look like ajax then set the target attribute of form as hidden iFrame.

Answer 2

You need to set the data in your $.ajax() call. Right now you're submitting a blank post.

Try using something like this:

$.post("../user/usercontroller/do_upload", //calling controller function
  $('#frm').serialize(),
  function(data4){ 
    alert('in ajax'+data4);
  },
  "json"
);