File upload with jQuery

JavaScript
1

Hi Guys!

I am trying to upload a file from a HTML form using jQuery and PHP. I have the following script, which I just need to adapt to add the support for uploading files.


jQuery(document).ready(function(){
	
	$('#contactform').submit(function(){
	
		var action = $(this).attr('action');
		
		$('#contactform #submit').attr('disabled','disabled').after('<img src="images/assets/ajax-loader.gif" class="loader" />');
		
		$("#response").slideUp(750,function() {
		$('#response').hide();	
		
		$.post(action, { 
			Name: $('#Name').val(),
			Mobile: $('#Mobile').val(),
			Email: $('#Email').val(),
			dob: $('#dob').val(),
			sex: $('#sex').val(),
			Message: $('#Message').val()
		},
			function(data){
				document.getElementById('response').innerHTML = data;
				$('#response').slideDown('slow');
				$('#contactform img.loader').fadeOut('fast',function(){$(this).remove()});
				$('#contactform #submit').attr('disabled',''); 
				if(data.match('success') != null) $('#contactform').slideUp('slow');
				
			}
		);
		
		});
		
		return false; 
	
	});
	
});

Any suggestions or help very much appreciated.

2

You can’t upload files using an ajax request.

What you could do, is to use something like swfupload or uploadify to upload the file seperately, then pass the file path (returned from the flash upload) along with the ajax request.