我正在尝试使用SweetAlert2设置警报,并在其中包含一个表单。
为此,我发出一个Axios请求,该请求将使我获得表单的HTML呈现,并将其插入警报中。
然后,当我验证时,我将序列化输入的数据并验证表单。
回到控制器,如果一切正常,我将返回一个JSON响应(200)以表示一切正常。
但是,如果表单包含错误,我想从.catch()更新警报的'Html'属性,将其替换为表单的新HTML呈现,但其中将包含要纠正的错误>
所以,我已经:
Controller.php
/**
* @Route("/admin/stripe/product/{id}/update/form", name="stripe_admin_product_update_form", options={"expose"=true})
*
*/
public function updateProductForm(StripeProduct $product, Request $request)
{
$form = $this->createFormBuilder($product)
->setAction($this->generateUrl('stripe_admin_product_update_form', ['id' => $product->getId()]))
->add("name")
->add("unitLabel")
->add("bankStatementLabel")
->getForm();
$form->handleRequest($request);
if($form->isSubmitted())
{
if($form->isValid())
{
return new JsonResponse([
"code" => 200,
"message" => "C'est bon"
]);
}
else
{
$response = [
"form" => $this->render("stripe_admin/product/_form_edit.html.twig", [
"form" => $form->createView(),
])->getContent()
];
return new JsonResponse($response, 400);
}
}
$response = [
"code" => 200,
"form" => $this->render("stripe_admin/product/_form_edit.html.twig", [
"form" => $form->createView(),
])->getContent()
];
return new JsonResponse($response);
}
在我的模板中:
template.html.twig
$(".js-update-coupon").click(function(){
productId = {{product.id}};
var url = Routing.generate("stripe_admin_product_update_form", {id: productId});
axios.get(url)
.then(function(response){
var form = response.data.form;
Swal.fire({
title: "Modifier ?",
html: form,
icon: "question",
showCancelButton: true,
showLoaderOnConfirm: true,
allowOutsideClick: () => !Swal.isLoading(),
preConfirm: function(result)
{
var data = $("#formUpdate").serialize();
return axios({
method: 'post',
url: url,
data: data
})
.then(function(response) {
Swal.fire({
title: 'Modifications enregistrées !',
icon: 'success',
}).then(function() {
document.location.reload(true);
});
})
.catch(function(response) {
console.log(response);
var formError = response.data.form;
console.log(formError);
Swal.fire({
html: formError,
})
})
}
});
});
})
问题出在.catch()级别
我似乎无法更新警报的“ HTML”属性。
如果我做出console.log(response);
,我就
Error: Request failed with status code 400
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.handleLoad (xhr.js:61)
PS:400代码是我的。如果我通过输入代码500来更改答案,我将拥有相同的内容,但是代码为500