PHP和Ajax将文件路径上传到Mysql并将重命名的图像保存到文件夹失败

Posted 2023-03-05

【中文标题】PHP和Ajax将文件路径上传到Mysql并将重命名的图像保存到文件夹失败

【英文标题】：PHP and Ajax Upload file path to Mysql and save renamed image to the folder fails

【发布时间】：2019-02-19 13:26:52

【问题描述】：

我正在尝试将文件路径和其他参数上传到 mysql，我使用 Ajax 和 php 将文件保存到文件夹中失败，对于字符串参数没关系，但是将文件参数获取到数据库我得到空文件数据。

一个错误：Uncaught TypeError: Illegal invocation

html 表单：

     ................

 <form role="form" action="" 
          method="post" autocomplete="off" class="form" 
 enctype="multipart/form-data" > 

                            <div class="form-group">
                               <label class="" for="">Ministry in the 
   church(facultative)</label>
                                <input type="text" name="mn_church" placeholder="Facultative" class="form-control" id="mn_church">
                            </div>

                        </fieldset> 
                       <!-- end -->

                       <!-- Attachements -->

                        <fieldset>
                     <h4>Document attachments:</h4><br>       
                        <div class="form-group">
                    <label class="" for="">Last degree obtained</label>
                         <input type="file" name="ldgree" placeholder="Upload" class=" form-control" id="ldgree">
                            </div> 

                 <button type="button" class="btn btn-previous">Previous</button>
                          <button type="button" onclick="insertDataThirdStep() " class="btn btn-next">Next</button>
                            </div>
                        </fieldset> 
                     .............

PHP 代码：

     ------------------      
$mn_church = trim($_POST['mn_church']);
$mn_church = strip_tags($mn_church);
$mn_church = htmlspecialchars($mn_church);

         // upload file
      $ldgree = $_FILES['ldgree']['name'];
      $tmpName = $_FILES['ldgree']['tmp_name'];
      // Rename image with a random number
      $random_digit=rand(0000,9999);
     $renamed_image=$random_digit.$ldgree;
          //upload renamed image and image path to db variable 
             $filePath = $uploadDir . $renamed_image;
       //upload renamed image and  path image to the folder 
   $result = move_uploaded_file($tmpName, $filePath);
    if(!get_magic_quotes_gpc())
  
// $fileName = addslashes($fileName);

// Add slashes between folder and image     
    $filePath = addslashes($filePath);
     
          // end first file
       //start student application by inserting the form's data to database
      $query = "
    UPDATE 
    aku_student_application
     SET 
  mychurch ='$mn_church',
 last_degree_optained='$filePath ',
   "
   -------------------

我曾经使用 php 使用 ajax 的 Jquery 代码以避免页面重新加载：

          var mn_church=$("#mn_church").val();

  //  Attachment    
 var ldgree = $('#ldgree').prop('files')[0];

$.ajax(

        url:'step-4-appli-form-attachments.php',
        method:'POST', 
                data:   

                        mn_church:mn_church,
                        ldgree:ldgree
                    ,
             success:function(response)
                        // alert(response);
                    console.log('Success fourth step');
                    

【问题讨论】：

您是否针对该错误查看了此内容？ ***.com/questions/11071100/…

一个update 语句需要一个where 子句-除非您希望更新所有记录...这真的是所有相关代码吗？？

@IncredibleHat，是的It say that error occurs when I try to passs an HTML element instead of its value，我需要知道如何将file 元素从Ajax 传递到PHP

@RamRaider , 不管 where 子句因为问题不在于

看起来我们需要更多的 JS 块而不是您提供的短片。在其他新闻中，请查看“FormData”以设置包含文件的 ajax 数据发送。 (***.com/questions/21044798/…)

【参考方案1】：

使用此解决方案，您可以使用一种表单将多个文件的路径上传到 mysql 和将照片上传到文件夹，我使用的技巧是 FormData 也可以上传文件和字符串（文本）。

首先我提供了我的表单 id 的 ID，然后我在 Jquery 文件中引用了 Id 以便在表单数据中使用它。

HTML 代码：

.......

<form role="form" action="" 
      method="post" autocomplete="off" class="form" 
  enctype="multipart/form-data" id="myform" > 
                        <div class="form-group">
                           <label class="" for="">Ministry in the 
   church(facultative)</label>
                            <input type="text" name="mn_church" placeholder="Facultative" class="form-control" id="mn_church">
                        </div>

                    </fieldset> 
                   <!-- end -->

                   <!-- Attachements -->

                    <fieldset>
                 <h4>Document attachments:</h4><br>       
                    <div class="form-group">
                <label class="" for="">Last degree obtained</label>
                     <input type="file" name="ldgree" placeholder="Upload" class=" form-control" id="ldgree">
                        </div> 

             <button type="button" class="btn btn-previous">Previous</button>
                      <button type="button" onclick="insertDataThirdStep() " class="btn btn-next">Next</button>
                        </div>
                    </fieldset> 
                 .............

我像这样重新格式化了我的 php 代码：

      $mn_church = trim($_POST['mn_church']);
$mn_church = strip_tags($mn_church);
$mn_church = htmlspecialchars($mn_church);

  $fileName = rand(0000,9999).'_'.$_FILES['ldgree']['name'];
    $sourcePath = $_FILES['ldgree']['tmp_name'];
      $targetPath = "images/fuploads/".$fileName;
      if(move_uploaded_file($sourcePath,$targetPath))
            $uploadedFile = $fileName;
        
      $query = "
UPDATE 
aku_student_application
 SET 
    mychurch ='$mn_church',
  last_degree_optained='$targetPath' "

使用 php 的 Jquery 代码

      function insertDataFourthStep() 


var form = document.getElementById('myform');
var church _Input = document.getElementById('mn_church');
var Lastdgree_Input = document.getElementById('ldgree').files[0];



var mn_church= new FormData(form);
var ldgree = new FormData(form);


student_id.append("mn_church",church _Input);
ldgree.append("file",Lastdgree_Input);


    $.ajax(

        type: 'POST',
        url: 'step-4-appli-form-attachments.php',
        data:ldgree,mn_church,         
        contentType: false,
        cache: false,
        processData:false, 

        success: function(data)
       console.log('Success fourth step');
            // clear file field
            // $("#ldgree").val("");
        
    );

   

感谢朋友们的积极参与