使用Ajax将数组发布到PHP

Question

I can't get the POST values for 'name' and 'email' onclick to pass to my PHP. 我无法获得onclick的“名称”和“电子邮件”的POST值来传递给我的PHP。 $_POST has no values in the array. $ _POST在数组中没有值。 I think I need to add variables to the Javascript but I can't get the syntax correct. 我想我需要向Javascript添加变量，但是语法不正确。 Please help, thanks! 请帮忙，谢谢！

<script>

    function _(el){ return document.getElementById(el); 
    } 
    function uploadFile(){ 
        var file = _("file1").files[0];
        var formdata = new FormData(); 
        formdata.append("file1", file); 
        var ajax = new XMLHttpRequest(); 
        ajax.upload.addEventListener("progress", progressHandler, false); 
        ajax.addEventListener("load", completeHandler, false); 
        ajax.addEventListener("error", errorHandler, false); 
        ajax.addEventListener("abort", abortHandler, false); 
        ajax.open("POST", "file_upload_parser.php"); 
        ajax.send(formdata);
    }

    function progressHandler(event){ 
        _("loaded_n_total").innerHTML = "Uploaded "+event.loaded+" bytes of "+event.total; 
        var percent = (event.loaded / event.total) * 99; 
        _("progressBar").value = Math.round(percent); 
        _("status").innerHTML = Math.round(percent)+"% uploaded... please wait"; 
    }
    function completeHandler(event){
         _("status").innerHTML = event.target.responseText; 
         _("progressBar").value = 0; 
    }
    function errorHandler(event){ 
        _("status").innerHTML = "Upload Failed"; 
    } 
    function abortHandler(event){ 
        _("status").innerHTML = "Upload Aborted"; 
    }

    </script> 

    </head> 
    <body> 


    <center>
    <table width="700" border="0">
    <form id="upload_form" enctype="multipart/form-data" method="post">
       <tr>
        <td><strong>Name:</strong></td>
        <td><input type="text" name="name" id="name" size="35"></td>
      </tr>  
      <tr>
        <td><strong>Email:</strong></td>
        <td><input type="text" name="email" id="email" size="35"></td> 
      </tr>
      <tr>
        <td><strong>Select File:</strong></td>
        <td><input type="file" name="file1" id="file1"></td>
      </tr>
      <tr>
        <td colspan="2">
        <input type="button" value="Upload File" onclick="uploadFile()"> 
        <progress id="progressBar" value="0" max="100" style="width:300px;"></progress> 
        <h3 id="status"></h3> 
        <p id="loaded_n_total"></p> 
        </td>
       </tr> 
    </form>
    </table> 
    </center>

Answer 1

This is the correct answer: 这是正确的答案：

formdata.append("name", document.getElementById('name').value);  
formdata.append("email", document.getElementById('email').value);

So the full block to append from above would look like this: 因此，要从上方追加的完整块如下所示：

function uploadFile(){ 
    var file = _("file1").files[0];
    var formdata = new FormData(); 
    formdata.append("file1", file);
    formdata.append("name", document.getElementById('name').value);  
    formdata.append("email", document.getElementById('email').value);   
    var ajax = new XMLHttpRequest(); 
    ajax.upload.addEventListener("progress", progressHandler, false); 
    ajax.addEventListener("load", completeHandler, false); 
    ajax.addEventListener("error", errorHandler, false); 
    ajax.addEventListener("abort", abortHandler, false); 
    ajax.open("POST", "file_upload_parser.php"); 
    ajax.send(formdata);
}

使用Ajax将数组发布到PHP

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-06-21 16:58:48

使用Ajax将数组发布到PHP

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-06-21 16:58:48

解决方案1
0 已采纳 2014-06-21 16:58:48