Question

我正在测试一些代码，基本上是尝试将HTML表单重定向到AJAX调用（POST），该调用显示在我的服务器上运行的脚本的响应。

HTML

<form id='form' name='qform' method='post' action='./resources/comment-redirect.php'>

<input type='search' name='name' class='comment-instance' autofocus='autofocus' value='name' />

<input type='search' name='email' class='comment-instance' autofocus='autofocus' value='email (not published)' />

<TEXTAREA name='comment-box' class='comment-instance' COLS=60 ROWS=5 value='email' />

<button type='submit' id='comment-submit' value='Submit'>--SUBMIT--</button>

</form>

JAVASCRIPT

$('#comment-submit').click(function(e){
         e.preventDefault();

         console.log("User clicked");
         jQuery.ajax({
             type:'POST',
             url: './resources/comment-redirect.php',
             data: {'name':$('[name=name]').val().toString(), 'email':$('[name=email]').val().toString(), 'comment':$('[name=comment-box]').val().toString() },
             dataType: 'json',
             success: function(result){
             console.log(result);
            }

         }); //end of JQuery.Ajax()



//PHP
if( !empty($_GET['a'] ) )
{
    print("This request has been routed to GET\n");
}
else if( !empty($_POST) )
{
    print("This request has been routed to POST\n");
    print($_POST);
}
else
{
    print("Other");
}

所以目前，在控制台窗口中我得到'用户点击'，这意味着回调确实有效 - 但是没有AJAX响应。我已经使用了一个浏览器并手动测试了我的PHP脚本，并且也通过了（GET和POST）。因此，由于某种原因，这个Ajax调用似乎没有被触发。

任何帮助都会非常感谢Stack。

Answer 1

您已在ajax请求中设置type:'POST'，但在服务器端，您尝试从$_GET获取已发送的数据，因此首先，在您的php代码中，您不要我需要检查$_GET数组，因为您知道，您要将数据发送到$_POST数组。

你有这个

data: {
    'name':$('[name=name]').val().toString(),
    'email':$('[name=email]').val().toString(),
    'comment':$('[name=comment-box]').val().toString()
}

只是摆脱.toString()，它已经是字符串，即使文本框包含数字值，它也被视为字符串。

您有dataType: 'json'，但是您没有打印json string，json string看起来像这样

'{"key1":"value1","key2":"value2"}'

因此，您的完整代码（jQuery）应如下所示

$('#comment-submit').click(function(e){
    e.preventDefault();
    console.log("User clicked");
    $.ajax({
        type:'POST',
         url:'./resources/comment-redirect.php',
         data:{
             'name':$('[name=name]').val(),
             'email':$('[name=email]').val(),
             'comment':$('[name=comment-box]').val()
         },
         dataType: 'json',
         success: function(result){
              // Will output a JavaScript object (if a json string is returned)
             console.log(result);
         }
     });
});

在服务器端，如果您未返回（打印）json string，请将dataType更改为html或使用此类内容返回有效的json string < / p>

echo json_encode(array('key1' => 'value1', 'key2' => 'value2'));

因此，在您的success回调中，您将获得一个JavaScript对象并可以像

一样使用它

success:function(result){
    console.log(result.key1); // will output value1
    console.log(result.key2); // will output value2
}

如果url正确，那么它应该有效。根据您当前的代码，它可能是

if( !empty($_POST) )
{
    // everything in $_POST array will be encoded as a json string
    echo json_encode($_POST);
}

如果你想添加

print("This request has been routed to POST\n");

在您的json string中，您可以试试这个

$_POST['msg'] = 'This request has been routed to POST';
echo json_encode($_POST);

在成功回调中，你可以得到像这样的字符串（msg）

console.log(result.msg); // will output "This request has been routed to POST"

将HTML表单重定向到Ajax请求

1 个答案: