jquery serializeArrayはHTMLのtextareaとチェックボックスの値を取得しません

Question

helo、私はhtml形式からサーバーにデータを渡したいと思います。サーバー、私はcodeigniterを使用します。私はajaxメソッドを使用します。

HTMLフォーム：

<div id="fileupload"> 
     <form id="upload-media-form" class="upload-media-form" method="POST" action="<?php echo base_url('register_task/upload_media') ?>" enctype="multipart/form-data"> 

      <div class="form-group col-md-12"> 
      <?php 

      /*** 
      * Get a profile pic url and create checkbox option 
      * 
      * @author Dwi Purnomo <dwipurnomo.yk@gmail.com> 
      * 
      ***/ 
      $igSessionLength = count($instagram); 
      for ($i = 0; $i < $igSessionLength; $i++) { 

       echo "<input type=\"checkbox\" class=\"flat ig_dipilih zinput\" name=\"ig_id[]\" value=\"".$instagram[$i]['id']."\"><img class=\"avatar upload\" src=\"".$instagram[$i]['prof_pic']."\">"; 

      } 
      ?> 
      </div> 

      <div class="form-group col-md-12"> 
       <label class="control-label col-md-3 col-sm-3 text-right" for="ig_caption">Caption</label> 
       <div class="col-md-6 col-sm-6"> 
       <textarea id="ig_caption" required class="form-control col-md-7 zinput" name="ig_caption" placeholder="#caption, misal 'ayo piknik #petualangan'"></textarea> 


       </div> 
      </div> 

      <div class="form-group col-md-12"> 
      <label class="control-label col-md-3 col-sm-3 text-right" for="ig_media">File Foto</label> 
      <div class="col-md-6 col-sm-6"> 
       <span class="btn btn-success fileinput-button"> 
        <i class="glyphicon glyphicon-plus"></i> 
        <span>Pilih foto...</span> 
        <input type="file" name="ig_media[]" id="imageInput" class="zinput" accept="image/*" multiple> 
       </span> 
      </div> 
      </div> 
      <input type="hidden" name="cron" class="cron-time zinput" value=""> 
      <input type="radio" name="tipe" class="flat zinput" value="sekali" checked>Sekali jalan<br > 
      <input type="radio" name="tipe" class="flat zinput" value="jadwal">Terjadwal 

     </form> 
    </div> 
    <br /> 
    <div class="cron-upload"></div> 

    <!-- Message --> 
    <img src="<?php echo base_url('assets/images/loading.gif') ?>" id="loading-img" style="display:none;" alt="Please Wait"/> 
    <button type="submit" id="submit-btn" class="btn btn-primary btn-ok"><i class="glyphicon glyphicon-upload"></i>Upload Semua</button> 

    <div id="progress" class="col-md-12 progress"><div id="progress-bar progress-bar-success"></div></div> 
    <div id="output" class="col-md-12"></div> 
    </div> 

JavaScriptのAJAX：

// Upload 
    $(function() { 
    'use strict'; 
    function handleFileSelect(evt) { 
    var files = evt.target.files; 
    for (var i = 0, f; f = files[i]; i++) { 
     if (!f.type.match('image.*')) { 
      continue; 
     } 

     var reader = new FileReader(); 
     reader.onload = (function (theFile) { 
      return function (e) { 
       console.log(e); 
       var span = document.createElement('span'); 
       span.innerHTML = 
       [ 
        '<img style="width: 128px" src="', 
        e.target.result, 
        '" title="', escape(theFile.name), 
        '"/>' 
       ].join(''); 

       document.getElementById('output').insertBefore(span, null); 
      }; 
     })(f); 

     reader.readAsDataURL(f); 
    } 
} 

if ($('#fileupload').length) { 
    var url = $('.upload-media-form').attr('action'); 
    var idDipilih = $("input[name='ig_id[]']:checked").map(function(i, e) { 
     return $(this).val(); 
    }).get(); 

    var toSerialize = ''; 
    for (var i = 0; i < idDipilih.length; i++) { 
     toSerialize += 'ig_id[]=' + idDipilih[i] + '&'; 
    } 

    var caption = $('#ig_caption').serialize(); 
    $('#fileupload').fileupload({ 
     url: url, 
     dataType: 'json', 
     formData: $('.zinput').serializeArray(), 
     acceptFileTypes: /(\.|\/)(jpe?g|png)$/i, 
     maxFileSize: 20999000, 
     previewMaxWidth: 128, 
     previewCrop: true, 
     add: function (e, data) { 
      $('#submit-btn').on('click', function() { 
       data.submit(); 
      }); 
     }, 
     done: function (e, data) { 
      console.log('done'); 
      console.log(e); 
      console.log(data); 
      $('#submit-btn').off('click'); 
      $.each(data.result.files, function (index, file) { 
       console.log(file); 
       $('<div class="box">').appendTo('#output'); 
       $('.box').last().html('<a href="'+file.url+'"><img width="128px" src="'+file.url+'"/></a>'); 
      }); 
     }, 
     progressall: function (e, data) { 
      console.log('progressall'); 
      console.log(e); 
      console.log(data); 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
      $('#progress .progress-bar').css(
       'width', 
       progress + '%' 
      ); 
     } 
    }).prop('disabled', !$.support.fileInput) 
     .parent().addClass($.support.fileInput ? undefined : 'disabled'); 

    $('#imageInput').change(handleFileSelect); 
}}); 

CodeIgniterの入力後の応答から私は取得のみ：

array(3) { 
    ["ig_caption"]=> 
    string(0) "" 
    ["cron"]=> 
    string(9) "0 0 * * *" 
    ["tipe"]=> 
    string(6) "sekali" 
    } 

私も[] ig_idを取得したいです（複数のチェックボックスデータ）とig_caption（textarea）の値を返します。してください、私を助けて

Answer 1

この命令から、私はjqueryのファイルのアップロードを使用した入力タイプのファイルが

https://api.jquery.com/serializeArray/