AJAX/jQuery的/ PHP - AJAX表单处理程序 “非法调用”

Question

我试图创建AJAXform handler。问题是我在上传图片文件时遇到了麻烦。

上传的文件会导致：

Uncaught TypeError: Illegal invocation

我想这是因为我AJAXformhandler有processData设置为默认值，因此不能文件转换成字符串。 但是，如果我将processData设置为false，那么发送的数据将不会被我的php文件识别。

我怎么能让这个表单发送文件和字符串，然后在PHP中读取它们？

这里是我的阿贾克斯/ jQuery的：

$('#createcompany').click(function() { 

      var formData = { 

       'ownerid'    : $('#id').text(), 
       'companyname'   : $('#companyname').val(), 
       'logo'     : $('#logo')[0].files[0], 
       'investment'    : $('#investment').val(), 
       'payment'    : $('#payment').val(), 
       'companytype'   : $('#companytype').val(), 
       'companyresource'  : $('#companyresource').val() 
      }; 

      $.ajax({ 
       type  : 'POST', 
       url   : 'processcreatecompany.php', 
       data  : formData, 
       dataType : 'json', 
       encode  : true 
      }).done(function(data) { 

       console.log(data); 

      }).fail(function(data) { 

       console.log(data); 

     }) 
    }); 

而且我PHP数据接收线：

$ownerid = filter_input(INPUT_POST, 'ownerid', FILTER_SANITIZE_STRING); 
    $companyname = filter_input(INPUT_POST, 'companyname', FILTER_SANITIZE_STRING); 
    $investment = filter_input(INPUT_POST, 'investment', FILTER_DEFAULT); 
    $payment = filter_input(INPUT_POST, 'payment', FILTER_DEFAULT); 
    $companytype = filter_input(INPUT_POST, 'companytype', FILTER_SANITIZE_STRING); 
    $companyresource = filter_input(INPUT_POST, 'companyresource', FILTER_SANITIZE_STRING); 

文件的要求我会使用这样的：

$_FILES['logo'] 

编辑：形式的

HTML标记（有点乱，因为我刚加入的形式能够调用它）：

<form id="formcompany"> 
     <div class="new-company-informations"> 
      <h1>BASIC INFORMATION</h1> 
      <div id="company-name" class="company-info"><h1>Company name:</h1><input type="text" name="companyname" id="companyname" maxlength="50"></div> 
      <div id="company-logo" class="company-info"><h1>Company logo:</h1><input type="file" name="logo" id="logo"></div> 
      <div id="company-investment" class="company-info"><h1>First investment amount:</h1><input type="text" name="investment" id="investment"></div> 
      <div id="company-payment" class="company-info"><h1>Basic wage per EP:</h1><input type="text" name="payment" id="payment" maxlength="20"></div> 
     </div> 

     <div class="new-company-separator"></div> 

     <div class="new-company-area"> 
      <h1>AREA OF ECONOMY</h1> 
      <div id="company-type" class="company-area"> 
       <h1>Company type:</h1> 
       <select name="companytype" id="companytype"> 
        <option value="" selected="selected">Choose company type</option> 
        <option value="1">Resource gathering (5.000 eDollars)</option> 
        <option value="2">Processing/manufacturing (15.000 eDollars)</option> 
        <option value="3">Production (30.000 eDollars)</option> 
        <option value="4">Labolatory (100.000 eDollars)</option> 
        <option value="5">Architecture development (500.000 eDollars)</option> 
        <option value="6">Innovations (1.000.000 eDollars)</option> 
       </select> 
      </div> 
      <div id="company-resource" class="company-area"> 
       <h1>Resource:</h1> 
       <select name="companyresource" id="companyresource"> 
        <option value="" selected="selected">Choose resource</option> 
        <option value="1">Lumbermill (Wood)</option> 
        <option value="2">Quarry (Stone)</option> 
        <option value="3">Mine (Ore)</option> 
        <option value="4">Mine (Coal)</option> 
        <option value="5">Farm (Food)</option> 
        <option value="6">Farm (Leather and cloth)</option> 
       </select> 
      </div> 

      <input type="hidden" value="<?=$_SESSION['user']['id']?>"> 
      <div id="company-button" class="company-area"> 
       <button id="createcompany">Create</button> 
      </div> 
     </div> 
    </form> 

Answer 1

使用FORMDATA和解析表单的ID。这样做，你的表格中的所有内容，包括文件，将通过AJAX进行解析，当然你的服务器端（PHP）

var formData = new FormData(this); 

$.ajax({ 
        type  : 'POST', 
        url   : 'processcreatecompany.php', 
        data  : formData, 
        dataType : 'json', 
        contentType: false, 
        processData: false,       
       }).done(function(data) { 

        console.log(data); 

       }).fail(function(data) { 

        console.log(data); 

      }) 
     }); 

在你的PHP

，为此，

var_dump('Posted fields are '.$_POST); 
var_dump('Files are '. $__FILES);