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
Solved

Post file via the $.post() jquery method

Posted on 2015-02-08
3
113 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

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
jquery + C#.net radiobuttonlist 3 30
Insert Button on a table 16 38
send email part1 9 28
Validating textboxes in red square borders. 2 13
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
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 code hide show and toggles. 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…

828 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