如何从 AJAX 提交的表单中获取响应？
How to obtain response from form submitted by AJAX?
我想使用 Acymailing Joomla！安装在 example.com/mailer 的组件用于管理来自 example.com
上非 Joomla 站点的 订阅
在那种情况下我有简单的脚本
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
$.ajax({
type: 'post',
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: $('form').serialize(),
success: function () {
swal('Great success!');
}
});
});
});
和表格
<form class="form-inline" action="https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub" method="post">
<div class="form-group">
<label class="sr-only" for="user_name">Email address</label>
<input id="user_name" type="text" name="user[name]" value="" class="form-control" placeholder="Email">
</div>
<div class="form-group">
<label class="sr-only" for="user_email">Password</label>
<input id="user_email" type="text" name="user[email]" value="" class="form-control" placeholder="Password">
</div>
<button type="submit" class="btn btn-default">Sign Up!</button>
<input type="hidden" name="user[html]" value="1" />
<input type="hidden" name="acyformname" value="formAcymailing1" />
<input type="hidden" name="ctrl" value="sub"/>
<input type="hidden" name="task" value="optin"/>
<input type="hidden" name="redirect" value="https://example.com"/>
<input type="hidden" name="option" value="com_acymailing"/>
<input type="hidden" name="visiblelists" value=""/>
<input type="hidden" name="hiddenlists" value="1"/>
</form>
一切正常，除了成功、错误状态...
Joomla Acymailing 有 sub.php 文件来处理 ajax 回复
if($config->get('subscription_message',1) || $ajax){
if($allowSubscriptionModifications){
if($statusAdd == 2){
if($userClass->confirmationSentSuccess){
$msg = 'CONFIRMATION_SENT';
$code = 2;
$msgtype = 'success';
}else{
$msg = $userClass->confirmationSentError;
$code = 7;
$msgtype = 'error';
}
}else{
if($insertMessage){
$msg = 'SUBSCRIPTION_OK';
$code = 3;
$msgtype = 'success';
}elseif($updateMessage){
$msg = 'SUBSCRIPTION_UPDATED_OK';
$code = 4;
$msgtype = 'success';
}else{
$msg = 'ALREADY_SUBSCRIBED';
$code = 5;
$msgtype = 'success';
}
}
}else{
if($modifySubscriptionSuccess){
$msg = 'IDENTIFICATION_SENT';
$code = 6;
$msgtype = 'warning';
}else{
$msg = $modifySubscriptionError;
$code = 8;
$msgtype = 'error';
}
}
if($msg == strtoupper($msg)){
$source = acymailing_getVar('cmd', 'acy_source');
if(strpos($source, 'module_') !== false){
$moduleId = '_'.strtoupper($source);
if(acymailing_translation($msg.$moduleId) != $msg.$moduleId) $msg = $msg.$moduleId;
}
$msg = acymailing_translation($msg);
}
$replace = array();
$replace['{list:name}'] = '';
foreach($myuser as $oneProp => $oneVal){
$replace['{user:'.$oneProp.'}'] = $oneVal;
}
$msg = str_replace(array_keys($replace),$replace,$msg);
if($config->get('redirect_tags', 0) == 1) $redirectUrl = str_replace(array_keys($replace),$replace,$redirectUrl);
if($ajax){
$msg = str_replace(array("\n","\r",'"','\'),array(' ',' ',"'",'\\'),$msg);
echo '{"message":"'.$msg.'","type":"'.($msgtype == 'warning' ? 'success' : $msgtype).'","code":"'.$code.'"}';
}elseif(empty($redirectUrl)){
acymailing_enqueueMessage($msg,$msgtype == 'success' ? 'info' : $msgtype);
}else{
if(strlen($msg)>0){
if($msgtype == 'success') acymailing_enqueueMessage($msg);
elseif($msgtype == 'warning') acymailing_enqueueMessage($msg,'notice');
else acymailing_enqueueMessage($msg,'error');
}
}
}
并且 JSON 看起来像在 Joomla 端通过 index.php?option=com_acymailing&ctrl=sub
注册到相同的表单
message Subscribe confirmed
type success
code 3
{"message":"Subscribe confirmed","type":"success","code":"3"}
问题是：如何在外部提交表单（在example.com页面）上获取提交状态成功、错误、已提交等？
我也遇到这种problem.for解决这种类型的问题我把一个变量作为参数html。
e.g. success(html)
和
console.log(html)
这显示了所有错误，包括通知和所有错误。打开 errore_reporting['E_ALL'];。并且不要将 dataType 设置为 'json' .
这个简单的更改可能适合您：
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
$.ajax({
type: 'post',
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: $('form').serialize()
}
}).done(function (data) {
swal('Great success!');
});
});
});
个人喜欢：
$.post("https://example.com...", {
data: $('form').serialize()
}, function(data) {
swal('Great success!');
});
由于您的结果在 JSON 中，因此应该更像是：
$.post("https://example.com...", {
data: $('form').serialize()
}, function(data) {
console.log(data); // shows full return object in console
swal('Great success!');
}, "json");
试试下面的，我已经在评论里面解释了变化：
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
var formdata = $(this).serializeArray(); //i really prefer serializeArray better than serialize (up2u)
$.ajax({
type: 'post',
dataType: 'json', //because your data is json
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: formdata,
success: function (d) {//d is the return/response of your url (your question answer)
swal(
d.type+': '+d.code ,
d.message,
d.type
);
},
error: function(d){
swal(
'Oops..' ,
'Something went wrong!', //your json must be in trouble
'error'
);
console.log(d); //delete this in production stage
console.log(d.responseText); //i add this so you will know what happenned exactly when you get this error. delete this too in production stage
}
});
});
});
您问题的简单解决方案是：
success: function (data) {
$("#<id_of_tag>").html(data);
}
数据 : 从服务器到您的 AJAX 调用的响应 return
id_of_tag : 您要显示 returned 输出的位置。
这只是一个例子，你可以决定你想要什么样的数据return以及你想对你的回应做什么。
回答您的问题：函数中的 On Success 参数将包含您的回复。
就我而言，我正在 return 另一个 JSP 页面，我想在 div 标签中显示它。
另请查看下方 link ：我认为它可能对您有所帮助
Best way to check if AJAX request was successful in jQuery
我不觉得你的 ajax 有问题，我可以从 Joomla php 代码中看到，每次当你请求 joomla URL 你总是会得到 response header status code as 200，因此当我检查 joomla acymaling（joomla 版本 5.8.1 3.8.3) 该控制器的代码，我在 line number 74 上看到他们正在检查请求是否使用 ajax，但在 php header 中缺少 Access-Control-Allow-Origin这将限制您的外部呼叫，因此您可以将此 if 条件替换为：
if($ajax){
@ob_end_clean();
header("Content-type:text/html; charset=utf-8");
}
到
if($ajax){
@ob_end_clean();
header("Content-type:text/html; charset=utf-8");
header("Access-Control-Allow-Origin: *");
}
因此也允许来自任何其他域的调用，但请记住这也会导致您的 joomla 代码出现漏洞。您还需要更改 HTML 表单并在 HTML 中添加一个隐藏字段：
<input type="hidden" name="ajax" value="1" />
所以允许 ajax 通过你的 joomla 控制器文件请求。
现在在 ajax 的成功块中，您可以进行如下检查：
success:function(data, status, xhr){
var json = $.parseJSON(data);
swal(json.message, json.type);
}
我希望这能帮助你完成你想要的，祝你编码愉快。
我想使用 Acymailing Joomla！安装在 example.com/mailer 的组件用于管理来自 example.com
上非 Joomla 站点的 订阅在那种情况下我有简单的脚本
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
$.ajax({
type: 'post',
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: $('form').serialize(),
success: function () {
swal('Great success!');
}
});
});
});
和表格
<form class="form-inline" action="https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub" method="post">
<div class="form-group">
<label class="sr-only" for="user_name">Email address</label>
<input id="user_name" type="text" name="user[name]" value="" class="form-control" placeholder="Email">
</div>
<div class="form-group">
<label class="sr-only" for="user_email">Password</label>
<input id="user_email" type="text" name="user[email]" value="" class="form-control" placeholder="Password">
</div>
<button type="submit" class="btn btn-default">Sign Up!</button>
<input type="hidden" name="user[html]" value="1" />
<input type="hidden" name="acyformname" value="formAcymailing1" />
<input type="hidden" name="ctrl" value="sub"/>
<input type="hidden" name="task" value="optin"/>
<input type="hidden" name="redirect" value="https://example.com"/>
<input type="hidden" name="option" value="com_acymailing"/>
<input type="hidden" name="visiblelists" value=""/>
<input type="hidden" name="hiddenlists" value="1"/>
</form>
一切正常，除了成功、错误状态...
Joomla Acymailing 有 sub.php 文件来处理 ajax 回复
if($config->get('subscription_message',1) || $ajax){
if($allowSubscriptionModifications){
if($statusAdd == 2){
if($userClass->confirmationSentSuccess){
$msg = 'CONFIRMATION_SENT';
$code = 2;
$msgtype = 'success';
}else{
$msg = $userClass->confirmationSentError;
$code = 7;
$msgtype = 'error';
}
}else{
if($insertMessage){
$msg = 'SUBSCRIPTION_OK';
$code = 3;
$msgtype = 'success';
}elseif($updateMessage){
$msg = 'SUBSCRIPTION_UPDATED_OK';
$code = 4;
$msgtype = 'success';
}else{
$msg = 'ALREADY_SUBSCRIBED';
$code = 5;
$msgtype = 'success';
}
}
}else{
if($modifySubscriptionSuccess){
$msg = 'IDENTIFICATION_SENT';
$code = 6;
$msgtype = 'warning';
}else{
$msg = $modifySubscriptionError;
$code = 8;
$msgtype = 'error';
}
}
if($msg == strtoupper($msg)){
$source = acymailing_getVar('cmd', 'acy_source');
if(strpos($source, 'module_') !== false){
$moduleId = '_'.strtoupper($source);
if(acymailing_translation($msg.$moduleId) != $msg.$moduleId) $msg = $msg.$moduleId;
}
$msg = acymailing_translation($msg);
}
$replace = array();
$replace['{list:name}'] = '';
foreach($myuser as $oneProp => $oneVal){
$replace['{user:'.$oneProp.'}'] = $oneVal;
}
$msg = str_replace(array_keys($replace),$replace,$msg);
if($config->get('redirect_tags', 0) == 1) $redirectUrl = str_replace(array_keys($replace),$replace,$redirectUrl);
if($ajax){
$msg = str_replace(array("\n","\r",'"','\'),array(' ',' ',"'",'\\'),$msg);
echo '{"message":"'.$msg.'","type":"'.($msgtype == 'warning' ? 'success' : $msgtype).'","code":"'.$code.'"}';
}elseif(empty($redirectUrl)){
acymailing_enqueueMessage($msg,$msgtype == 'success' ? 'info' : $msgtype);
}else{
if(strlen($msg)>0){
if($msgtype == 'success') acymailing_enqueueMessage($msg);
elseif($msgtype == 'warning') acymailing_enqueueMessage($msg,'notice');
else acymailing_enqueueMessage($msg,'error');
}
}
}
并且 JSON 看起来像在 Joomla 端通过 index.php?option=com_acymailing&ctrl=sub
注册到相同的表单 message Subscribe confirmed
type success
code 3
{"message":"Subscribe confirmed","type":"success","code":"3"}
问题是：如何在外部提交表单（在example.com页面）上获取提交状态成功、错误、已提交等？
我也遇到这种problem.for解决这种类型的问题我把一个变量作为参数html。
e.g. success(html)
和
console.log(html)
这显示了所有错误，包括通知和所有错误。打开 errore_reporting['E_ALL'];。并且不要将 dataType 设置为 'json' .
这个简单的更改可能适合您：
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
$.ajax({
type: 'post',
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: $('form').serialize()
}
}).done(function (data) {
swal('Great success!');
});
});
});
个人喜欢：
$.post("https://example.com...", {
data: $('form').serialize()
}, function(data) {
swal('Great success!');
});
由于您的结果在 JSON 中，因此应该更像是：
$.post("https://example.com...", {
data: $('form').serialize()
}, function(data) {
console.log(data); // shows full return object in console
swal('Great success!');
}, "json");
试试下面的，我已经在评论里面解释了变化：
$(function () {
$('form').on('submit', function (e) {
e.preventDefault();
var formdata = $(this).serializeArray(); //i really prefer serializeArray better than serialize (up2u)
$.ajax({
type: 'post',
dataType: 'json', //because your data is json
url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub',
data: formdata,
success: function (d) {//d is the return/response of your url (your question answer)
swal(
d.type+': '+d.code ,
d.message,
d.type
);
},
error: function(d){
swal(
'Oops..' ,
'Something went wrong!', //your json must be in trouble
'error'
);
console.log(d); //delete this in production stage
console.log(d.responseText); //i add this so you will know what happenned exactly when you get this error. delete this too in production stage
}
});
});
});
您问题的简单解决方案是：
success: function (data) {
$("#<id_of_tag>").html(data);
}
数据 : 从服务器到您的 AJAX 调用的响应 return
id_of_tag : 您要显示 returned 输出的位置。
这只是一个例子，你可以决定你想要什么样的数据return以及你想对你的回应做什么。
回答您的问题：函数中的 On Success 参数将包含您的回复。
就我而言，我正在 return 另一个 JSP 页面，我想在 div 标签中显示它。
另请查看下方 link ：我认为它可能对您有所帮助
Best way to check if AJAX request was successful in jQuery
我不觉得你的 ajax 有问题，我可以从 Joomla php 代码中看到，每次当你请求 joomla URL 你总是会得到 response header status code as 200，因此当我检查 joomla acymaling（joomla 版本 5.8.1 3.8.3) 该控制器的代码，我在 line number 74 上看到他们正在检查请求是否使用 ajax，但在 php header 中缺少 Access-Control-Allow-Origin这将限制您的外部呼叫，因此您可以将此 if 条件替换为：
if($ajax){
@ob_end_clean();
header("Content-type:text/html; charset=utf-8");
}
到
if($ajax){
@ob_end_clean();
header("Content-type:text/html; charset=utf-8");
header("Access-Control-Allow-Origin: *");
}
因此也允许来自任何其他域的调用，但请记住这也会导致您的 joomla 代码出现漏洞。您还需要更改 HTML 表单并在 HTML 中添加一个隐藏字段：
<input type="hidden" name="ajax" value="1" />
所以允许 ajax 通过你的 joomla 控制器文件请求。
现在在 ajax 的成功块中，您可以进行如下检查：
success:function(data, status, xhr){
var json = $.parseJSON(data);
swal(json.message, json.type);
}
我希望这能帮助你完成你想要的，祝你编码愉快。