通过Ajax发送的上传文件名

本文介绍了通过Ajax发送的上传文件名的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个带有一些字段和文件上载选项的表格.我想通过Ajax将上传的文件发送到upload.php.这是我尝试过的代码，它不起作用.我在哪里做错了?请提出任何建议.

I have a form with some fields and file upload option. I want to send uploaded file through Ajax to upload.php. Here is a code which i have tried and it does not work. Where am i doing wrong? Any suggestions please.

Form.php

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" </script>
<script type="text/javascript">
$(document).ready(function() {
$("#submit_custom").click(function() {
 e.preventDefault();
 var postData = new FormData();

                postData.append('file[]', $('input[type=file]')[0].files[0]);
                postData.append('trxid', $('input[name=trxid]'));
                postData.append('orderid', $('input[name=orderid]'));
                postData.append('custid', $('input[name=custid]'));// Uncaught TypeError: Illegal invocation
  if(proceed)

 $.post('upload.php', post_data, function(response){
 if(response.type == 'error'){ //load json data from server and output message
  output = '<div class="error">'+response.text+'</div>';
  }else{
  output = '<div class="success">'+response.text+'</div>';
  $("#upload_form").slideUp(); //hide form after success
                    }
  $("#upload_form").hide().html(output).slideDown();
  }, 'json');
  });
 });
    </script>
</head>
<body>
<h2>Hello <?php echo $user ?> </h2> <p> "You have successfully done purchasing process.</p>
<div id="upload_form">
<p>To send your size details for your order please upload the following file:</p>
<p>Download custom size form Provide us your custom size: <a  href="download.php?download_file=custom-measurement-form.pdf">File.pdf</a></p>
<form enctype="multipart/form-data" action="" method="post">
    <input type="text" name="trxid" value="<?=$trx?>">
    <input type="text" name="orderid" value="<?=$orderid?>">
    <input type="text" name="custid" value="<?=$customerid?>">
    <input type="file" name="file">
    <input type="submit" id="submit_custom">
</form>
</div>
</body>
</html>

upload.php

<?php
if(isset($_POST['file'])){
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest') {
  $output = json_encode(array( //create JSON data
            'type'=>'error',
            'text' => 'Sorry Request must be Ajax POST'
   ));
   die($output);
    }
    $file=$_FILES['file']['name'];
    $trx=$_POST['trxid'];
    $oid=$_POST['orderid'];
    $cid=$_POST['custid'];
    echo $file;

    $query=mysqli_query($con,"insert into payments(custom_file) value ('$file') where orderid='$oid',trx_id='$trx' and cust_id='$cid' ");
    if($query){
        $m=move_uploaded_file($_FILES['file']['name'],'./ServerUploadedFiles/'.$trx.$file);
        $output = json_encode(array('type'=>'message', 'text' => 'Hi '.$user_name .' Thank you for your email'));
        die($output);
    }
    else
    {
        $output = json_encode(array('type'=>'error', 'text' => 'Problem uploading file! .'));
        die($output);
    }
}

?>

推荐答案

此代码发送数据并获取结果，您的代码没有任何作用

This code send data and get result, your code don't make something

测试文件a.php

 <html>
 <head>

 <!-- change jquery version, your give me some warnings -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

 <script type="text/javascript">

 $(document).ready(function() {

 var proceed=true; /* ** declare proceed */

 $("#submit_custom").click(function() {
 /*e.preventDefault();*/

 var postData = new FormData();

 alert('Found file '+$('[type=file]').val());
 postData.append('file', $('[type=file]')[0].files[0]);

 if(proceed) {

 $.ajax({
 processData: false, /* important */
 contentType: false, /* important */
 type: "POST",
 url: 'b.php',
 data: postData, /* ** here not post_Data but postData like declared in var*/
 error: function(jqXHR, textStatus, errorThrown){ alert(textStatus); },
 success:function(data, textStatus, jqXHR) {
 alert(data);
 var response;
 /* added */
 try { response = JSON.parse(data); } catch (err) { alert('Error parsing response.'); return; }

 alert('result after parsing json of a is     '+response.a);
 /* */
 },
 dataType: 'html'  /* I change it ot html for this example*/
 });

 }

 });

 });

 </script>

 </head>
 <body>
 <form  name="upload" enctypex="multipart/form-data" action="b.php" method="post">
 <input type="file" name="file">

 <input type="button" id="submit_custom" value="ajax">

 <input type="submit"  value="post">
 </form>
 </div>
 </body>
 </html>

测试文件b.php包含类似于json {"a":"2"}

Test file b.php contain response like a json {"a":"2"}

{"a":"2"}

在您能够发送并获得回复后，您添加了其他 pribambasi

After you will be able to send and get response, you add others pribambasi

这篇关于通过Ajax发送的上传文件名的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！