[英]How do I get a message in a div box instead of the alert box with ajax success?
I'm trying to create error validation handling for my custom form.我正在尝试为我的自定义表单创建错误验证处理。 What I want to do is get the error messages in a div instead of the browser alert box but I'm new to all of this and have no idea how to do it.
我想要做的是在 div 而不是浏览器警报框中获取错误消息,但我对所有这些都是新手,不知道该怎么做。 I tried to do some research but found nothing useful for my case.
我试图做一些研究,但没有发现对我的案例有用。
Basically my form works and shows error or success messages correctly, but I don't want to display them in the alert box, but in a dedicated div.基本上我的表单可以正常工作并正确显示错误或成功消息,但我不想在警报框中显示它们,而是在专用的 div 中显示它们。 Thanks for any answers, I appreciate any help.
感谢您的任何回答,感谢您的帮助。
So here's what I have:所以这就是我所拥有的:
My section which contains all the various messages error我的部分包含所有各种消息错误
<div class="error-message-wrapper">
<!-- Here are all my error messages that are printed with the wc_print_notices(); function -->
</div>
My Script我的脚本
jQuery(document).ready(function($) {
$('.mts-edit-account').on('submit', function(e) {
e.preventDefault();
//Ajax function
jQuery.ajax({
type: "post",
data: jQuery(".mts-edit-account").serialize(),
url: "wp-admin/admin-ajax.php",
success : function( response ) {
alert( response );
}
});
});
});
My function我的 function
function save_account_details() {
if (trim($_POST['account_first_name']) == '') {
$msg = wc_print_notices();
$response = $msg;
} else {
$response = "Settings Saved!";
}
// Don't forget to exit at the end of processing
echo json_encode($response);
exit();
}
If u wanna show in exist class then choose element by document.querySelector(".className").innerHtml = response.textFromResponse or u can do like below如果你想显示存在 class 然后通过 document.querySelector(".className").innerHtml = response.textFromResponse 选择元素,或者你可以像下面这样
Query(document).ready(function($) {
$('.mts-edit-account').on('submit', function(e) {
e.preventDefault();
//Ajax function
jQuery.ajax({
type: "post",
data: jQuery(".mts-edit-account").serialize(),
url: "wp-admin/admin-ajax.php",
success : function( response ) {
alert( response );
const uiDivElement = document.createElement("DIV");
uiDivElement.innerHTML = response.textFromResponse
document.appendChild(uiDivElement)
}
});
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.