Jquery Ajax PHP File upload

Question

Hi I am not able to get PHP FILES values in view.php, whereas normally it is found in view.php. Please help me out. Thanks in advance.

Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<title>Untitled Document</title>
<script type="text/javascript">
$( document ).ready(function() {
$('#uploadBtn').click(function() {
$.ajax( {
type: 'POST',
contentType:attr( "enctype", "multipart/form-data" ),
url: 'view.php',
data: $('myform').serialize() ,
success: function(data){
alert(data);
    }
});
});
});
</script>
</head>
<body>
<form enctype="multipart/form-data" method="post" action="view.php" name="myform">
<input id="f" type="file"  value=""  name="myfile"/>
<input type="button" value="try" id="uploadBtn" />
</form>
</body>
</html>

Sounds like a problem with the file path, can you post the exact Console error? — aurbano, Mar 28 '14 at 12:35
**Hi Chevi , thanks for your answer, No, path is ok , coz I have checked it with a normal ajax, it both file now residing at the same home** — Deep Mazumder, Mar 28 '14 at 12:38
Post the error you are getting, or anything really. With the code you have posted I doubt you will get much help — aurbano, Mar 28 '14 at 12:40

score 0 · Answer 1 · edited May 23 '17 at 12:28

0

The error you are getting is caused by trying to use "attr" as if it were a variable. You don't have to set the enctype of an AJAX request because that refers to forms only. You could set the appropriate Content-type though (to "multipart/form-data")

Aside from that, you are trying to upload a file using AJAX, which is not always possible. See this question for reference.

Quoting the accepted answer from that question:

With XHR2, File upload through AJAX is supported. E.g. through FormData object, but unfortunately it is not supported by all/old browsers.

I would recommend you try an AJAX file upload plugin, they usually do the job very well and will ensure cross-browser compatibility.

edited May 23 '17 at 12:28

Community

1
1

answered Mar 28 '14 at 13:02

aurbano

3,324
1
25
39

Thanks Bro, Btw, Do you recommend any specific plugin for that? which is easy to implement. – Deep Mazumder Mar 28 '14 at 13:09
I don't have any recommendation, quick Google search will reveal lots of plugins for that matter. – aurbano Mar 28 '14 at 13:15
Yea there is a lot but as per my requirement, itz better to create my own , plugins are not suites on my current code. – Deep Mazumder Mar 28 '14 at 13:22
Well you could use XHR2 with a fallback for older browsers, but I would do a normal upload (without AJAX) and simulate that effect with an iframe. You can detect when the iframe loads (upload complete) in JS and react to that event. – aurbano Mar 28 '14 at 13:25
OK thanks but I need full support on newer browser too. I slightly implemented the code , this time it is receiving the result but no FILES values yet.Says undefined index – Deep Mazumder Mar 28 '14 at 13:31

Jquery Ajax PHP File upload

1 Answers1