Wie Formdata erhalten und in Datenparameter auf ajax jquery

Question

ich ein Formular haben eine Menge Informationen und eine Datei Multiupload Uploader wie diese form.serialize hochladen:

<div class="col-md-4"> 
<div class="form-group"> 
    <label class="control-label col-md-3">Location</label> 
    <div class="col-md-9"> 
     <?php 
     $location = array(
      "type" => "text", 
      "name" => "location", 
      "id" => "location", 
      "class" => "form-control" 
     ); 
     echo form_input($location); 
     ?> 
     <span class="help-block"></span> 
    </div> 
</div> 
</div> 

<div class="col-md-12"> 
    <div class="form-group"> 
    <label class="control-label col-md-2">Warehouse</label> 
    <div class="col-md-10"> 
     <?php 
     foreach ($tipe as $v): 
      echo "<label class='checkbox-inline'><input type='checkbox' name='tipe[]' value='$v->ID_CHECK_LIST'>$v->NAMA_CHECK_LIST</label>"; 
     endforeach; 
     ?> 
     <p class="help-block"></p> 
    </div> 
    </div> 
</div> 

<div class="col-md-12"> 
    <div class="form-group"> 
    <label class="control-label col-md-2">Image If Damage</label> 
    <div class="col-md-4"> 
     <input type="file" multiple="" name="images[]"> 
     <p class="help-block"></p> 
    </div> 
    </div> 

Nun, ich brauche um sie mit Ajax zu senden. Ich habe versucht $ (form) .serialized(), aber die $ _FILES ist leer, also verwende ich FormData Klasse. Aber FormData behandelt nur die Datei, nicht die andere Eingabe. Wie kann ich die Daten im Aja-Parameter einstellen, um Datei und eine andere Eingabe zu behandeln.

Dies ist der Ajax-jquery

$('#form').submit(function() {    
     $('#btnSave').text('saving...'); //change button text 
     $('#btnSave').attr('disabled', true); //set button disable 

     var url; 
     var formData = new FormData(this); 

     if (save_method === 'add') { 
      url = "<?php echo site_url('members/it/Request/ajax_add') ?>"; 
     } else { 
      url = "<?php echo site_url('members/megumi/cek_list_wire_rod/ajax_update') ?>"; 
     } 

     // ajax adding data to database 

     $.ajax({ 
      url: url, 
      type: "POST", 
      data: formData, 
       processData: false, 
       contentType: false, 
       $('#form').serialize(), 
      dataType: "JSON", 
      success: function (data) 
      { 

       if (data.status) //if success close modal and reload ajax table 
       { 
        $('#modal_form').modal('hide'); 
        reload_table(); 
       } else 
       { 
        for (var i = 0; i < data.inputerror.length; i++) 
        { 
         $('[name="' + data.inputerror[i] + '"]').parent().parent().addClass('has-error'); //select parent twice to select div form-group class and add has-error class 
         $('[name="' + data.inputerror[i] + '"]').next().text(data.error_string[i]); //select span help-block class set text error string 
        } 
       } 
       $('#btnSave').text('Save'); //change button text 
       $('#btnSave').attr('disabled', false); //set button enable 
      }, 
      error: function (jqXHR, textStatus, errorThrown) 
      { 
       alert('Error adding/update data'); 
       $('#btnSave').text('save'); //change button text 
       $('#btnSave').attr('disabled', false); //set button enable 

      } 
     }); 
     return false; 
    }); 

Jede Hilfe es so geschätzt.

Answer 1

Verwenden Sie FormData für alle Ihre Daten, die Sie senden müssen, da PHP multipart/form-data sowie application/x-www-form-urlencoded unterstützt. Sie können key: value Paare zu FormData hinzufügen, und sie werden als normale $_POST Variablen angezeigt, aber die Dateien, die Sie hinzufügen, sind in $_FILES.

Beispiel:

var fd = new FormData(); 
fd.append('file1', file1); 
fd.append('file2', file2, 'newFile2Name.pdf'); 
fd.append('username', 'password'); 
fd.append('file_id', file_id); 

$.ajax({ 
    url: url, 
    type: "POST", 
    data: fd, 
    processData: false, 
    contentType: false, 
    success: function(response) {}, 
    error: function(xhr, textStatus, errorThrown) {}, 
    complete: function() {} 
}); 

Hinweis, dass es keine dataType Eigenschaft ist. Ihr zufälliger Code $('#form').serialize() muss gelöscht werden, da es sich um eine ungültige Syntax handelt (Sie können keine Ausdrücke in einen Objektliteralausdruck einfügen).

In PHP:

<?php 

$_FILES['file1']['name'] === 'file1.pdf'; 
$_FILES['file2']['name'] === 'newFile2Name.pdf'; 

$_POST['username'] === "password" 
$_POST['file_id'] === "4" 

?>