Я пытаюсь отправить форму с несколькими полями для загрузки изображений и ввода текста, однако, если я отправляю форму, я получаю сообщение об ошибке, что форма пуста. ниже мой код, я пытаюсь отправить форму с несколькими полями загрузки изображения и ввода текста, однако, если я отправляю форму, я получаю сообщение об ошибке, что форма пуста. ниже мой код
Форма
<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>