我想序列化我的表单,以便它可以通过 AJAX 发送到一个php文件。我使用Bootstrap预先验证表单。不幸的是,PHP代码返回一个空数组。奇怪的是,调试器似乎显示postData包含正确的字符串:
“a_location=abc&a_headline=def”
(function ($) {
"use strict";
function process_new_post(postData) {
$.ajax({
url:"createpost.php",
method:"POST",
data: postData ,
contentType: false,
processData: false,
cache: false,
success:function(response)
{
alert(response);
},
error:function(jqXHR, textStatus, errorThrown){
console.error("AJAX Request Error:", textStatus, errorThrown);
}
});
}
$(document).ready(function () {
var forms = document.querySelectorAll('.needs-validation');
Array.prototype.slice.call(forms)
.forEach(function (form) {
form.addEventListener('submit', function (event) {
Array.from(form.elements).forEach((input) => {
if ( (input.value.trim()==='') && (input.type!=='button') && (input.type!=='submit') ) {
input.value = '';
}
});
if ( !form.checkValidity() ) {
event.preventDefault();
event.stopPropagation();
}
else {
event.preventDefault();
process_new_post( $("#formcreatenewpost").serialize() );
}
form.classList.add('was-validated')
}, false);
});
});
})(jQuery);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="needs-validation" id="formcreatenewpost" method="post" enctype="multipart/form-data" novalidate>
<div class="row g-3">
<div class="col-md-6">
<div class="form-floating">
<input type="text" class="form-control" name="a_location" id="a_location" placeholder="Town(s)" required>
<label for="a_location">Town(s)</label>
</div>
</div>
<div class="col-12">
<div class="form-floating">
<input type="text" class="form-control" name="a_headline" id="a_headline" placeholder="Headline" required>
<label for="a_headline">Headline</label>
</div>
</div>
<div class="col-4 gy-5">
<button class="btn btn-primary w-100 py-3" type="submit" id="postcreatenewpost">Post</button>
</div>
</div>
</form>
<?php
print_r($_POST);
?>
1条答案
按热度按时间db2dz4w81#
你好,我刚刚检查了我的本地主机。
不要将contentType和processData设置为false。让 AJAX 自己处理。然后您将看到在控制器文件中读取的值。
正在调用提交事件处理程序中的else块。在脚本中记录postData也会返回所有的值,正如你自己所说的。问题在于你如何发送数据。