如何使用 Ajax-Php 处理多个表单答案

【问题标题】：How to process multiple forms with Ajax-Php如何使用 Ajax-Php 处理多个表单
【发布时间】：2020-01-12 00:27:53
【问题描述】：

在 HTML 页面上，我有两个表单。 Form1 包含几个输入。 Form2 用于将文件上传到服务器，因此按下“上传”按钮会通过 Ajax 调用一个 php，该 php 处理文件并将其上传到服务器。我遇到的问题是我找不到一种方法来实现，当按下“上传”按钮时，文件会像现在一样上传到服务器，但也可以处理 form1 中的数据并将其保存在数据库。

<form method="POST" id="frm_one>
   <input type="text" class="form-control" placeholder="Sol." aria-label="sc" aria-describedby="basic-addon1">
   <input type="text" class="form-control" placeholder="ID DOC" aria-label="Username" aria-describedby="basic-addon1">
</form>

<form method="POST" id="frm_two>
   <input type="text" class="form-control" placeholder="Piece" aria-label="sc" aria-describedby="basic-addon1">
   <input type="text" class="form-control" placeholder="Order" aria-label="Username" aria-describedby="basic-addon1">
</form>

<form action="procesar.php" method="POST" enctype="multipart/form-data" id="frm_subedoc">
   <input class="form-control p-1 border" type="file" name="file[]" id="selarchivos" multiple>
   <button type="button" class="btn btn-info form-control mt-3" id="btn_subir">Subir Archivos</button>
</form>

通过 Ajax 发送如下：

            $("#btn_subir").click(function(){
               var Form=new FormData($("#frm_subedoc")[0]);
               $.ajax({
                   url:"procesar.php",
                   type:"post",
                   data:Form,
                   processData:false,
                   contentType:false,
                   success: function(data){
                       $("#selarchivos").val('');
                   }
               });
           });

接收请求的PHP是：

<?php
   session_start();
   $carpeta="documentos/";
   $files_post=$_FILES['file']; 
   .
   .
   .
?>

问题是，如果我使用单个表单，我在form2中声明的参数'enctype="multipart/form-data"'会发生什么？影响传入的数据输入？另外，如果你修改我在PHP中恢复数据的方式，即$_POST['field']？

【问题讨论】：

如果你想让它们同时处理，为什么不把它做成一个表单呢？...
我同意第一条评论。如果您想一次发布所有内容，只需一张表格。不太确定问题是什么，只是将它们结合起来。您不能/不会这样做有充分的理由吗？
我添加了更多信息
@JuncoFuerte `'enctype="multipart/form-data"'` 影响input ??有什么影响？
当您通过 AJAX 提交表单时，enctype="multipart/form-data" 对任何内容都没有影响。 AJAX 请求根本不使用该属性。是的，您在同一请求中提交的任何其他（非文件）字段都可以通过 $_POST 在 PHP 中使用。文件输入字段将通过 $_FILES 提供。如果您通过 AJAX 或通过回发提交，这是正确的。没有区别。没有什么可以阻止您使用一种形式来完成这项工作。

标签： php html ajax

【解决方案1】：

说实话，我不再使用很多插件了，但这是我一直在使用的一个。为什么要重新发明轮子？

Ravi Kusuma's jQuery File Upload Plugin

对于您的情况，在他的文档页面上的 API & OPTIONS 选项卡上，请注意您可以随文件一起发送其他数据：

dynamicFormData: function()
{
    //var data ="XYZ=1&ABCD=2";
    var data ={"XYZ":1,"ABCD":2};
    return data;        
}

因此，在包含您的 AJAX 例程的函数中，您可以首先从其他表单中收集字段名称/值并将它们放入 javascript 对象中。然后，您可以使用上面的代码将该对象发送到接收该文件的服务器端配套 PHP 脚本。

还要注意Server Side 选项卡，它记录了您的后端 PHP 文件应该是什么样子。

参考资料：

PHP file upload inside modal window

Why isn't the image not copied to the folder?

http://hayageek.com/docs/jquery-upload-file.php

【讨论】：