Question

今天刚刚开始通过JQuery使用AJAX，我无处可去。作为一个例子，我已经为它做了一份工作。提交表单然后显示结果。显然我没有把它弄好。

HTML。

<form id="PST_DT"  name="PST_DT" method="post">
<input name="product_title_1682" id="product_title_1682" type="hidden" value="PADI Open Water">
<input name="product_title_1683" id="product_title_1683" type="hidden" value="PADI Advanced Open Water">

<input type="submit" name="submit" id="submit" value="Continue" onclick="product_analysis_global(); test();"/>

</form>
<span id="results"></span>

实际上还有很多字段都是动态加载的。我计划使用ajax向PHP提交一些简单的数学，然后返回结果，但我们可以稍后再担心。

JQuery

function test() {

    //Get the data from all the fields
    var alpha = $('#product_title_1682').val();
    JQuery.ajax({
        type: 'POST',
        url: 'http://www.divethegap.com/update/functions/totals.php',
        data: 'text=' + alpha,
        beforeSend: function () {
            $('#results').html('processing');
        },
        error: function () {
            $('#results').html('failure');
        },
        timeout: 3000,

    });
};

和PHP

<?php
$alpha = $_POST['alpha'];
 echo 'Marvellous',$alpha;
       ?>

这是我的尝试而没有任何反应。有什么想法吗？

非凡。

Answer 1

首先，当您的脚本正在查找$_POST['alpha']时，您将$ _POST变量作为'text'传递。如果您将PHP更新为$_POST['text']，则应该看到正确的文本。

此外，如果您的表单有很多输入，并且您希望确保将所有输入传递给您的AJAX请求，我建议使用jQuery的serialize()方法。

data: $('#PST_DT').serialize(), // this will build query string based off the <form>
// eg: product_title_1682=PADI+Open+Water&product_title_1683=PADI+Advanced+Open+Water

在PHP脚本中，您需要使用$_POST['product_title_1682']和$_POST['product_title_1683']。

更新在$ .ajax电话中添加成功回调。

function test() {        

    // serialize form data
    var data= $('#PST_DT').serialize();

    // ajax request
    $.ajax({
        type  : 'POST',
         url  : 'http://www.divethegap.com/update/functions/totals.php',
         data : data,
         beforeSend : function() {
             $('#results').html('processing');
         },
         error : function() {
             $('#results').html('failure');
         },
         // success callback
         success : function (response) {
             $('#results').html(response);
         },
         timeout : 3000,
    });

};

在PHP脚本中，您可以使用以下命令调试发送的信息：

var_dump($_POST);

Answer 2

在您的AJAX请求中，您发送参数foo.php?text=...，但在PHP文件中，您正在调用$_POST['alpha']，它会查找foo.php?alpha=...。

将$_POST['alpha']更改为$_POST['text']并查看是否有效。

Answer 3

有一种更简单的方法：

$("#PST_DT").submit(function(e){
e.preventDefault();
$.ajax({
data: $(this).serialize(),
type: "POST",
url: 'http://www.divethegap.com/update/functions/totals.php',
success: function(){
....do stuff.
}
});
return false;
});

这将允许您像正常一样处理变量。

AJAX表单提交和结果

3 个答案: