• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1649
  • Last Modified:

jquery ajax form and file upload.

I've been using jquery.ajax to post form data out of a dialog and its been working great except now I'm trying to add a file field to the form and I'm not sure how to send multipart/form-data.

the code I was using to upload the form is below.  userfile is the filefield.

// JavaScript Document
var title; 
 var content;
 var windowID; 
  var contentType;
 var formType; 
 var userfile;

function contentFormAjaxStuff(){
title = jQuery("#title").attr("value");
content = jQuery("#content").attr("value");
windowID = jQuery("#windowID").attr("value");
formType = jQuery("#formType").attr("value");
contentType = jQuery("#contentType").attr("value");
 userfile = jQuery("#userfile").attr("value");

  type: "POST",
  url: "backendContent.php",
  cache: false,

  dataType: "html",
  data: "title=" + title + "&content=" + content + "&windowID=" + windowID + "&contentType=" + contentType + "&formType=" + formType + "&userfile=" + userfile,
  success: function(response){
   // if sucessful; response will contain some stuff echo-ed from .php
   alert("Here is your response: " + response);
   // Append this response to some <div> => let's append it to div with id "serverMsg"

  error: function(){
   alert("Error occured during Ajax request...");
} // END OF FormAjaxStuff()

Open in new window

1 Solution
Gurvinder Pal SinghCommented:
enctype is not supported by jquery ajax thus you cant upload files using it as you do...

check here


esp the upload jquery plugin... they do it well

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now