【发布时间】:2019-11-13 21:07:18
【问题描述】:
我有一个 Bootstrap 4 Modal,它的主体中有一个表单。它有一个输入类型文本和一个输入类型文件,也可以上传多个文件。如何获取文本和图像并使用 AJAX 将它们发送到我的后端?
我的 HTML 标记:
<div class="modal fade" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title">Update Post</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- Modal body -->
<div class="modal-body">
<form class="updateForm">
<input type="text" class="form-control textt" name="text">
<label class="float-left m-2" style="padding: 4px; background-color: white;cursor: pointer;font-weight: 600;border-radius: 10px; border: none; box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);">
ADD PICTURES
<span>
<img src="http://www.transparentpng.com/thumb/logo-instagram/SKq9yH-black-and-white-instagram-logo-png.png" style="width: 25px; height: 25px;">
</span>
<input type="file" id="file-input" name="images[]" style="display: none;" class="inp" multiple >
<div id="preview"></div>
</label>
<button class="btn btn-warning btn-block updatee">UPDATE</button>
</form>
</div>
</div>
</div>
</div>
我试图将我的数据存储在这样的对象中:
$('.updateForm').submit(function(e){
e.preventDefault();
var values = {};
$.each($('.updateForm').serializeArray(), function(i, field) {
values[field.name] = field.value;
});
});
但它只给了我一个带有文本的对象。
【问题讨论】:
-
你知道ajax怎么用吗?
-
是的,我可以进行 AJAX 调用
标签: php jquery ajax laravel forms