Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Post file via the $.post() jquery method

Posted on 2015-02-08
3
Medium Priority
?
130 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 1600 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 44

Assisted Solution

by:Chris Stanyon
Chris Stanyon earned 400 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

Python: Series & Data Frames With Pandas

Learn the basics of Python’s pandas library of series & data frames and how we can use these tools for data manipulation.

Question has a verified solution.

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

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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)
Suggested Courses

722 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