Отправьте форму с несколькими изображениями и полями ввода, используя ajax и codeigniter - PullRequest
0 голосов
/ 31 марта 2020

Я пытаюсь отправить форму с несколькими полями для загрузки изображений и ввода текста, однако, если я отправляю форму, я получаю сообщение об ошибке, что форма пуста. ниже мой код, я пытаюсь отправить форму с несколькими полями загрузки изображения и ввода текста, однако, если я отправляю форму, я получаю сообщение об ошибке, что форма пуста. ниже мой код

Форма

  <form action="<?php echo site_url('/Add/add_product'); ?>" id="frmadd" enctype="multipart/form-data" method="post">
   <input type="file" id="files" class="uploadlogo" name="files[]" multiple><br/>
    <input type="text" name="product">
   <input type="submit" value="Add product">
    </form>

    <script type="text/javascript">

var selDiv = "";
  var storedFiles = [];
  $(document).ready(function() {
    $("#files").on("change", handleFileSelect);
    selDiv = $("#selectedFiles");       
    $("body").on("click", ".selFile", removeFile);
  });

  function handleFileSelect(e) {
    var files = e.target.files;
    var filesArr = Array.prototype.slice.call(files);
    filesArr.forEach(function(f) {          
        if(!f.type.match("image.*")) {
            return;
        }
        storedFiles.push(f);            
        var reader = new FileReader();
        reader.onload = function (e) {
            var html = "<div><img src=\"" + e.target.result + "\" data-file='"+f.name+"' class='selFile' title='Click to remove'>" + /*f.name + */ "<br clear=\"left\"/></div>";
            selDiv.append(html);                
        }
        reader.readAsDataURL(f); 
    }); 
  }

  $("#frmadd").submit(function (e){
    e.preventDefault();
    $("#loader").show();
        var form_data = new FormData();
    for(var i=0, len=storedFiles.length; i<len; i++) {
      form_data.append('files', storedFiles[i]);    
        }
    var url = $(this).attr('action');
    var data = $(this).serialize();
    $.ajax({
        url:url,
        type:'POST',
        data:form_data,
        processData: false,
        contentType: false,
    }).done(function (data){
        $("#loader").hide();
        $("#response").html(data);
    });
 });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...