Solved

Post file via the $.post() jquery method

Posted on 2015-02-08
3
112 Views
Last Modified: 2015-02-09
Experts,

I am trying to POST form data (several text fields and a file) via AJAX using the following code:
//POST FORM DATA AND SHOW SUCCESS MESSAGE
$.post("save.php?submit",
	$("#new_request_form").serialize()).done(
		//ALERT USER THAT PROJECT HAS BEEN SAVED
		function(){
			alert('Your request has been submitted for consideration.\n\nPlease check your Lotus Notes inbox for a copy of your submission.\n\nPress "OK" to continue.');
		},//END FUNCTION
		//REDIRECT
		function(){
			document.location.href = "demo.php";
		}//END FUCTION
);

Open in new window

All of my form data posts correctly except the File field. I've read that this may have to do with the serialization of the data as it is being passed.

Can someone help me update my code so that it posts the File field that I have in my form?

Cheers!
0
Comment
Question by:evibesmusic
3 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 400 total points
ID: 40597727
Hi,
as far as I know, the serialize would not take file inputs.
Depending on the supported client browsers (e.g. IE 8) you might have a better chance by using
$( "#new_request_form" )
  .submit( function( event ) {
$.ajax( {
      url: '/save.php',
      type: 'POST',
      data: new FormData( this ),
      processData: false,
      contentType: false
    } );
});

Open in new window

HTH
Rainer
0
 
LVL 43

Assisted Solution

by:Chris Stanyon
Chris Stanyon earned 100 total points
ID: 40598270
Although technically it can be done, it's a bit of a nightmare, and not widely supported across all browsers (won't work in IE9). You would save yourself a headache by just using one of the various plugins available - such as Uploadify. Do a google for jQuery File Upload
0
 

Author Closing Comment

by:evibesmusic
ID: 40598974
Thank you.

I will change methods as per both suggestions.
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question