提交后将 <input type="file"> 传递给其他表单

Posted 2023-02-24

【中文标题】提交后将 <input type="file"> 传递给其他表单

【英文标题】：pass <input type="file"> to other form after submit

【发布时间】：2012-08-07 03:18:33

【问题描述】：

我有一个使用 ajax 提交的上传表单。

这一切都很好，但我想要做的是将我上传的文件的名称存储在隐藏的输入类型中，所以当我提交带有文本字段的表单时，图像的名称可以提交到数据库.

我注意到当我将主表单提交到数据库时，图像的名称已经丢失。我刚刚意识到输入文件在上传表单上，所以名称不会被提交。

我的问题是如何将上传文件的名称传递给我的其他表单？

在我的主要形式中，我想我会有一个

<input type="hidden" name="imgname" id="imgname" value="" />

这是我提交表单的 jquery

<script type="text/javascript"> 
    $(document).ready(function()  
        //elements
        var progressbox     = $('#progressbox');
        var progressbar     = $('#progressbar');
        var statustxt       = $('#statustxt');
        var submitbutton    = $("#SubmitButton");
        var myform          = $("#UploadForm");
        var output          = $("#output");
        var lotterydiv      = $("#lottovidpreview");
        var completed       = '0%';

        $(myform).ajaxForm(
            beforeSend: function()  //brfore sending form
                lotterydiv.remove();
                submitbutton.attr('disabled', ''); // disable upload button
                statustxt.empty();
                progressbox.slideDown(); //show progressbar
                progressbar.width(completed); //initial value 0% of progressbar
                statustxt.html(completed); //set status text
                statustxt.css('color','#000'); //initial color of status text
            ,
            uploadProgress: function(event, position, total, percentComplete)  //on progress
                progressbar.width(percentComplete + '%') //update progressbar percent complete
                statustxt.html(percentComplete + '%'); //update status text
                if(percentComplete>50) 
                    statustxt.css('color','#fff'); //change status text to white after 50%
                
            ,
            complete: function(response)  // on complete
                output.html(response.responseText); //update element with received data
                myform.resetForm();  // reset form
                submitbutton.removeAttr('disabled'); //enable submit button
                progressbox.slideUp(); // hide progressbar
            
        );
    );

</script>

我还假设我需要在 complete: function 部分做一些事情，但不知道是什么。我需要获取发送到 php 脚本的文件的名称来移动图像还是可以从客户端获取它？

【问题讨论】：

首先，确保form 的enctype 是multipart/data。然后，一旦提交表单 ($_FILES['imgname']['name'])，您就可以通过 PHP $_FILES 结构访问该文件。

@Matt - AFAIK，这不适用于 AJAX 提交的表单。

@Paul 那是我的错；我没有完全阅读这个问题。如果所有 OP 想要传递文件名，$("#imgname").val() 不应该工作吗？

您可以在 AJAX 响应中包含文件名，然后在您的完整函数中访问它。

我该怎么做？对 jquery 来说还是很新的

【参考方案1】：

我只需要完整输入：函数

$("#imagename").val($("#filepc").val());