Я пытаюсь загрузить файл с помощью ajax, который дает мне ошибку, а остальная загрузка данных успешно выполняется без аякса, когда файл загружается, но когда я пытаюсь загрузить файл через ajax, он дает мне ошибку. Я полностью путаюсь, почему ajax дает мне проблему. Здесь мой код.
<html> <head> <script src="jquery-1.8.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#button").click(function(){ var form_data = $('#reg_form').serialize(); $.ajax({ type:"POST", url:"process.php", data:form_data, success: function(data) { $("#info").html(data); } }); }); }); </script> </head> <body> <form id="reg_form" enctype="multipart/form-data" method="post" action=""> name : <input type="text" name="name" id="name"/> </br> message : <input type="text" name="message" id="message" /> </br> Image : <input type="file" name="file" id="file" /> <input type="button" value="Send Comment" id="button"> <div id="info" /> </form> </body> </html>
Здесь содержится кодировка файла process.php.
<?php mysql_connect("localhost","root",""); mysql_select_db("ajaxdatabase"); $name=$_POST["name"]; $message=$_POST["message"]; //storing file in filename variable $fileName = $_FILES['file']['name']; //destination dir $to="image/".$fileName; move_uploaded_file($_FILES['file']['tmp_name'],$to); $query=mysql_query("INSERT INTO common(name,message,destination) values('$name','$message','$to') "); if($query){ echo "Your comment has been sent"; } else{ echo "Error in sending your comment"; } ?>
Прежде всего, функция serialize () не работает для файла, вам нужно создать объект формы, через который вы сможете опубликовать данные, и будет работать отлично. У меня была такая же проблема, и я только что решил вашу проблему и работает на 100% потому что я проверил это. Пожалуйста, проверьте. Форма.
<form name="multiform" id="multiform" action="process.php" method="POST" enctype="multipart/form-data"> name : <input type="text" name="name" id="name"/> </br> message : <input type="text" name="message" id="message" /> </br> Image : <input type="file" name="file" id="file" /> </form> <input type="button" id="multi-post" value="Run Code"></input> <div id="multi-msg"></div>
Сценарий.
<script type="text/javascript"> $(document).ready(function(){ $("#multiform").submit(function(e) { var formObj = $(this); var formURL = formObj.attr("action"); if(window.FormData !== undefined) { var formData = new FormData(this); $.ajax({ url: formURL, type: 'POST', data: formData, mimeType:"multipart/form-data", contentType: false, cache: false, processData:false, success: function(data, textStatus, jqXHR) { $("#multi-msg").html('<pre><code>'+data+'</code></pre>'); }, error: function(jqXHR, textStatus, errorThrown) { $("#multi-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus='+textStatus+', errorThrown='+errorThrown+'</code></pre>'); } }); e.preventDefault(); e.unbind(); } }); $("#multi-post").click(function() { //sending form from here $("#multiform").submit(); }); }); </script>
И ваш php-файл тот же, что я тестировал и работает.
<?php mysql_connect("localhost","root",""); mysql_select_db("ajaxdatabase"); $name=$_POST["name"]; $message=$_POST["message"]; //storing file in filename variable $fileName = $_FILES['file']['name']; //destination dir $to="image/".$fileName; move_uploaded_file($_FILES['file']['tmp_name'],$to); $query=mysql_query("INSERT INTO common(name,message,destination) values('$name','$message','$to') "); if($query){ echo "Your comment has been sent"; } else{ echo "Error in sending your comment"; } ?>