AJAX not submiting

Question

我有一个laravel项目，管理员可以通过表单更改用户数据。我希望这个表单由ajax提交。但它没有被提交。

我有一张表格：

<form id="userData{{$loop->iteration}}" method="POST">
@csrf
<!--some inputs-->
</form>
<button id="changeUserData{{$loop->iteration}}" data-id="#userData{{$loop->iteration}}">Save</button>

JS:

$("#changeUserData{{$loop->iteration}}").click(function (e) {
var ele = $(this);
var formId = ele.attr("data-id");
console.log(formId);
$(formId).submit(function (e){
console.log("test2");
e.preventDefault();
$.ajax({
url: '{{url('changeUserData')}}',
method: "PATCH",
data: $(formId).serialize(),
success: function(){
console.log("test");
}
})
})
});

当我按下按钮时，第一个console.log会被启动，但其他什么都没有。我检查了表单id是否与表单id匹配，它确实匹配，所以我不知道出了什么问题。

Answer 1

问题是带有handler参数的.submit()不提交表单本身。它只是将一个事件处理程序绑定到表单的submit事件。

你可以删除绑定，它应该可以工作：

$("#changeUserData{{$loop->iteration}}").click(function (e) {
var ele = $(this);
var formId = ele.attr("data-id");
console.log(formId);
$.ajax({
url: '{{url('changeUserData')}}',
method: "PATCH",
data: $(formId).serialize(),
success: function(){
console.log("test");
}
})
})