PHP + jQuery + Ajax表单提交 - 在同一页面上返回结果

时间:2011-04-15 19:46:10

标签: php jquery ajax forms

我想要以下内容:

用户通过单击(index.php)提交表单,表单输入由外部PHP文件(search.php)处理,结果发布在原始页面上(index.php)在一个div。

我已经把大部分代码放在了一起。它在单击时提交表单并将其发送到PHP脚本。

我现在需要的是PHP脚本的结果会返回到原始页面(index.php)。

到目前为止,这是我的代码:

function submit() {
    $(function() {
        var id = "id";
        var dataString = 'id=' + id;
        $.ajax({
            type: "POST",
            url: "inc/search.php",
            data: dataString,
            success: function() {
                goToByScroll("result");
                $('#result').html("<br><br><br><br><br><br><br><br><br><br><
                                   div class='center'><img src='img/loader.gif' /></div>").hide().fadeIn(2500, function() {
                $('#result').html("Finished");
                });
            }
        });
        return false;
    });
}

我的PHP文件(用于测试)是:

<?php function safe($value)
{
    htmlentities($value, ENT_QUOTES, 'utf-8');
    return $value;
}
if (isset($_POST['id'])) {
    $id = safe($_POST['id']);
    echo ($id);
}
elseif (!isset($_POST['id'])) {
    header('Location: error?id=notfound');
} ?>

我希望将search.php(在本例中为“id”)的结果发布到#result中,但我无法弄清楚如何:S

2 个答案:

答案 0 :(得分:7)

我认为你几乎拥有一切。您在success下的回调函数需要一个参数来代表search.php的结果

     success: function(res) {
             goToByScroll("result");
             $('#result').html("<br><br><br><br><br><br><br><br><br><br><div class='center'><img src='img/loader.gif' /></div>").hide().fadeIn(2500, function() {
                 $('#result').html(res + "<br /><br /> Finished");
             });
         } 

res输出的所有内容均为search.php。回声,php标签之外的东西等等。如果你自己加载了search.php,你会看到任何东西。

我不知道你是否想要'完成'仍然在那里。如果你不这样做,请把它拿出来。

答案 1 :(得分:2)

向成功函数添加参数,例如:

success: function(param) { ... }

param是一个字符串,它是服务器端脚本的所有输出。您可以将其设置为您想要的任何内容并将其放在某个元素

$("#element").html(param);