【问题标题】:Ajax Form Submission Works But No ResponseAjax 表单提交工作但没有响应
【发布时间】:2013-10-28 09:28:49
【问题描述】:

我正在使用用户将选择的菜单从数据库中删除记录。在菜单下方,我有一个显示数据库记录的表格。当我手动刷新页面时,表格中的显示结果显示该记录已被删除,但是,尽管我尽了最大努力,但我的#results 部分似乎没有收到任何消息。

这是 HTML:

<form action="" method="POST" name="deleteAccountForm">
        <table>
            <thead>
                    <th>Delete Account</th>
                    <th></th>
            </thead>    
            <tbody>
                <tr>
                    <td><select name="deleteMenu" id="deleteMenu">
                    <?php
                    foreach($accounts as $key=>$value) { ?>
                        <option name="account_name" value="<?php echo $value['account_id_PK']; ?>"><?php echo $value['account_name']; ?></option>
                    <?php } ?>
                    </select>

                    </td>
                    <td><input type="submit" name="delete" value="Delete"></td>

                </tr>
            </tbody>
        </table>
    </form>

还有我的 Javascript:

var delAccount = function(e) {
    e.preventDefault();
    var data = $('#deleteAccountForm').serialize();

    $.ajax({
        type: "POST",
        url: "inc/functions.php",
        data: data,
        beforeSend: function() {
            $('#results').html('processing');
        },
        error: function() {
            $('#results').html('failure');
        },
        success: function(response) {
            $('#results').html(response);
        },
        timeout: 3000,
    });
};

还有我的 PHP:

function delete_account() {

    require(ROOT_PATH . "/inc/database.php");

    $deleteAccount = $_POST['deleteMenu'];



    try {
        $results = $db->prepare("DELETE FROM account WHERE account_id_PK = ?");
        $results->bindValue(1, $deleteAccount);
        $results->execute();
    } catch(Exception $e) {
        echo "ERROR: Data could not be removed from the database. " . $e;
        exit;
    }
}

我还需要知道如何在完成后运行一个函数来更新我的显示表中的结果,而无需手动刷新页面。

【问题讨论】:

    标签: javascript php ajax database


    【解决方案1】:

    你如何在你的 javascript 中这样做:

    var delAccount = function(e) {
        e.preventDefault();
    
        // Get the option that will be deleted to remove it
        // later on success.
        var opt  = $('#deleteMenu').children(':selected');
    
        var data = $('#deleteAccountForm').serialize();
    
        $.ajax({
            type: "POST",
            url: "inc/functions.php",
            data: data,
            beforeSend: function() {
                $('#results').html('processing');
            },
            error: function() {
                $('#results').html('failure');
            },
            success: function(response) {
                $('#results').html(response);
                // Remove the option
                opt.remove()
            },
            timeout: 3000,
        });
    };
    

    关于#results 的消息,在您的PHP 中,我只看到您在出现错误时做出响应,除非成功响应已创建并发送到其他地方?

    [编辑]

    应该在try 块的末尾创建响应,在这种情况下也发送。如果脚本到达那部分,则表示一切正常。

    function delete_account() {
        require(ROOT_PATH . "/inc/database.php");
        $deleteAccount = $_POST['deleteMenu'];
    
        try {
            $results = $db->prepare("DELETE FROM account WHERE account_id_PK = ?");
            $results->bindValue(1, $deleteAccount);
            $results->execute();
    
            // If everything goes fine here, you can output the
            // success response.
            // Echo getAccounts() assuming it returns HTML (string).
            // Otherwise, setup your HTML and then echo it.
            echo getAccounts();
        } catch(Exception $e) {
            echo "ERROR: Data could not be removed from the database. " . $e;
            exit;
        }
    }
    

    【讨论】:

    • 不,响应不是在其他地方创建的。我将如何修改我的 PHP 以发送正确的响应?
    • 我有另一个名为 getAccounts 的 PHP 函数,用于将数据库记录显示到页面。我如何在 deleteAccount 函数的末尾调用该函数以更新页面上的 html 表?
    • 我编辑了答案。如果这不是您需要的,请告诉我。
    【解决方案2】:

    您正在向 "inc/functions.php" 提交数据。我假设您在问题中显示的 php 代码 sn-p 在此页面内,并且您已在 ANYWAY 中调用它。
    现在第一件事,您在 php 文件中没有回显任何内容。 无论在 serer 端 php 脚本上回显什么,都只会发送到您在 ajax:success 方法中使用的变量“response”中的客户端。
    此外,尚不清楚您的#result id 标签在 html 页面中的位置。
    我的建议是,你使用“jquery离线学习工具包”(在google上搜索这个词,你会得到下载链接),它包含了所有的示例代码,你将学习如何有效地使用ajax,以及在成功或不成功的 ajax 提交后如何使用 jquery 选择器操作 dom。

    【讨论】:

      猜你喜欢
      • 2017-03-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-09-03
      • 1970-01-01
      • 2014-04-28
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多