如何在不刷新页面的情况下将文件与其他文本输入一起上传

我使用下面的代码成功上传文件而无需刷新页面。我现在想要的是为该文件的标题添加一个文本输入字段，并添加一个textarea来描述该文件，但我很难做到这一点。它给我'未定义索引'错误。我应该在我的代码中添加什么来上传文件，文本输入和textarea？如何在不刷新页面的情况下将文件与其他文本输入一起上传

HTML

<form action="trash_one.php" method="post" id="uploadForm"> 
    <div id="targetLayer">No Image</div> 
    <div id="uploadFormLayer"> 
    <label >Upload Image</label><br> 
    <input type="file" class="inputFile" name="userImage" id="userImage"> 
    <input type="submit" name="submit" class="btnSubmit"> 
</form> 
<div>

EXPECTED HTML FORM

文本输入和textarea的加入

<form action="trash_one.php" method="post" id="uploadForm"> 
    <div id="targetLayer">No Image</div> 
    <div id="uploadFormLayer"> 
    <input type="text" name="img_name"> 
    <label >Upload Image</label><br> 
    <input type="file" class="inputFile" name="userImage" id="userImage"> 
    <textarea name="description" ></textarea> 
    <input type="submit" name="submit" class="btnSubmit"> 
</form> 
<div>

JAVASCRIPT

$(document).ready(function(e) { 
    $("#uploadForm").on('submit',(function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     url: "trash_one.php", 
     type: "POST", 
     data: new FormData(this), 
     contentType: false, 
     cache: false, 
     processData: false, 
     success: function(data){ 
      $("#targetLayer").html(data); 
     }, 
     error: function(){ 
     } 
    }); 
})); 
});

PHP

这个脚本只上传文件

if(is_array($_FILES)){ 
    if(is_uploaded_file($_FILES['userImage']['tmp_name'])){ 
     $sourcePath = $_FILES['userImage']['tmp_name']; 
     $targetPath = "imagess/".$_FILES['userImage']['name']; 
     if(move_uploaded_file($sourcePath,$targetPath)){ 
     ?> 
     <img src="<?php echo $targetPath; ?>" width="100px" height="100px" /> 
     <?php 
     } 
    } 
}

来源

2017-09-24 Oponjous

你的代码为我工作，尝试'print_r（$ _ POST）;'它应该告诉你，你的数据已经通过。 – MinistryofChaps

当然我的代码有效。我想要做的是将一个文本输入字段和textarea添加到表单。如果我添加这些字段，我应该对我的PHP脚本和JavaScript进行哪些修改以便上传所有数据？ – Oponjous

所以你有文件数据存储工作，只需通过'$ _POST'获取其他数据。所以'$ name = $ _POST ['img_name']; $ description = $ _POST ['description'];'。 – MinistryofChaps

你的代码已经工作就像你想。只要看看$_POST阵列而不是$_FILES阵列。后数组包含所有文本字段内容。文件数组包含上传的文件。

来源

2017-09-24 22:42:26

如何在不刷新页面的情况下将文件与其他文本输入一起上传

回答

相关问题