Question

我正在处理我的第一个使用jQuery执行AJAX HTTP POST的HTML表单。当用户对输入文本字段和选项卡进行更改时，它会触发AJAX脚本，该脚本又调用执行数据库更新的PHP脚本。

AJAX调用可以成功，但数据库更新可能不成功（例如数据库相关错误） - 我想将PHP脚本的结果插入警报中。我可以在PHP脚本中回显任何错误，但我不确定如何将其转换为适当的警报。

这是我的Javascript：

 <script type="text/javascript">
   $(document).ready(function() {
    $("#storeManager").change(function(){
        var storeManager = $("#storeManager").val();
        $.post('editProject.php', { storeManager: storeManager, id: '1E1DDA14-D2C6-4FC8-BA5F-DBCCC7ABAF7F' }, function(data) {
            $("#managerRow").addClass("success");

        }).fail(function () {
            // no data available in this context
            $("#managerRow").addClass("danger");
            $("#ajaxAlert").addClass("alert alert-danger");
        });
     }); 
});
</script>

这是包含触发AJAX调用的输入字段的HTML表：

    <table class="table table-striped table-bordered table-hover">
    <tbody>
    <tr>
    <td>Store</td>
    <td>Acme Widgets Inc</td>
    </tr>
    <tr>
    <td>Retailer</td>
    <td>Acme Corp</td>
    </tr>
    <tr>
    <td>Store ID</td>
    <td>9876543</td>
    </tr>
    <tr>
    <td>State</td>
    <td>NSW</td>
    </tr>
    <tr class="" id="managerRow">
    <td>Manager</td>
    <td>

    <input type="text" class="form-control" id="storeManager" name="storeManager" value="Peter Johns">

    </td>
    </tr>
    <tr>
    <td>Phone</td>
    <td>9222 3456</td>
    </tr>
    </tbody>
    </table>

    <div class="" id="ajaxAlert" role="alert"></div>

我想要做的是，如果editProject.php脚本中存在任何错误，它存储在$ error变量中并且可以回显，然后将其插入ajaxAlert并添加一个类：alert：< / p>

<div class="alert alert-danger" id="ajaxAlert" role="alert">The error from the database update from the php script appears here</div>

我是jQuery和AJAX的新手，我尝试的所有内容都没有使用新类和警报文本更新警报，我似乎无法找到类似于演示此内容的示例。

Answer 1

您可以在jquery中使用append()。尝试使用

fail(function () {
        // no data available in this context
        $("#managerRow").addClass("danger");
        //append error to the div using its ID
        $('#ajaxAlert').append('error from database');
    });

Answer 2

试试这个：而不是.fail（）;

    var storeManager = $("#storeManager").val();
    $.post('editProject.php', { storeManager: storeManager, id: '1E1DDA14-D2C6-4FC8-BA5F-DBCCC7ABAF7F' }, function(data) {
        alert(data);

    },function (xhr, data, jx) {
        // the error function should be mentioned like this with comma after success fucntion
        console.log(xhr);//for console logging the error...
         alert(xhr);//NOW you will get data and alert will show...
    });

Answer 3

的index.php

----php start---------     
if(isset($_POST['name'])){
    $dbc = mysqli_connect('','','','');
    $sql = "UPDATE accounts set name='".$_POST['name']." WHERE email='".$_POST['mail']."' LIMIT 1";
    if(mysqli_query($dbc, $sql) === true)){
        echo 'success'; exit();
    }else{
        echo 'connection error'; exit();
    }
}
----php end  ---------
<script>
    function test(){
        var formDATA = {
            'name': $('#input_name').val(),
            'mail': $('#input_mail').val()
        };
        $.ajax({
            type: 'POST',
            url: 'index.php',
            data: formDATA,
            success: function(response){
                if(response == 'success'){
                    $('#result').html('Your Update Was Complete');
                }else{
                    $('#result').html();
                }
            }
        });
    }
</script>
<input id="input_mail" type="text" value="">
<input id="input_name" type="text" value="">
<button onclick="test();">Test Ajax</button>
<div id="result"></div>

尝试一些简单的东西，这是一个非常基本的ajax和php版本。由于按钮触发功能，您甚至不需要表格（并不意味着您不应该使用表格）。但是我把它简单化了，所以你可以遵循一切。

很抱歉，当我添加php打开和关闭标签时，它并没有显示为代码。也不要忘记包含你的jquery资源。

警告：不要像示例那样进行查询，这是一个巨大的安全隐患！

将结果从AJAX调用传递给PHP脚本

3 个答案: