jQuery Ajax post with both file and data??

Thes开发者_运维百科e lines below are the form data that I need to post using an AJAX request, and get back a JSON response.

<textarea type='text' id="newStatusBox">Your Status here...</textarea>
Link:<input type="text" id="newStatusLink"/>
Video:<input type="text" id="newStatusVideo"/>
Image : <input type="file" id="newStatusImage" size="20" />
<input type='button' value="post" id="status-post-button" onclick='postStatus()'/>

When I use the $.ajax of jQuery in postStatus() to post the data, I'm not getting the image file in that page.

Is there any other solution to achieve what I want?

You cannot upload files via AJAX unless people use a recent browser.

Anyway, you can simply use the jQuery form plugin. If you have a file upload field in your form it will fallback to a hidden IFRAME instead of XHR. However, in this case your response must be sent as text/html and wrapped in a <textarea> since it cannot send a proper JSON content type as it would cause browsers to show a download dialog.

You could also have a look at http://www.plupload.com/ which wraps tons of upload technologies and uses the best one available for each user.