更改时自动更新 MySQL 行

Question

我有一个管理面板，我希望能够在不刷新或更改页面的情况下实时更改客户的订单状态。我发现我需要为此使用 Javascript、AJAX 或 jQuery，但因为我没有这方面的经验，也没有时间学习所有内容，所以我要求你帮助实现这一点。

我的代码：

<form>
    <select name="status">
        <option value="0">Ej verifierad</option>
        <option value="1">Väntar på betalning</option>
        <option value="2">Postas ASAP</option>
        <option value="3">POSTAD!</option>
        <option value="4">Annulerad</option>
    </select>
</form>

订单状态保存在 MySQL 数据库中。

请注意，我将在一个页面上有很多表格，并且只希望更新已更改的表格，但在我更改时直接更新。

提前感谢您的回答。

Answer 1

一定要使用 jQuery。这是进行 AJAX 调用的最简单方法......这是在 JavaScript 中完成的。所以，我想最好的答案是，你需要全部三个！

让 PHP 页面接受 POST 参数，而不是使用 action="myFormResponder.php" 和 method="post" 提交表单，保持原样，并将其放在网页顶部（在结束 </head> 标记之前）：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $('#myForm').submit(function(){
            $.post("myFormResponder.php",$('#myForm').serialize(), function(data, textStatus, xhr){
                // Do whatever you need here to update your page when the AJAX call finishes
            });
            return false; // Cancel default submit action
        });
    });
</script>

另外，请参阅：jQuery Documentation: $.post()。这将帮助您了解如何处理传递给回调的数据。

我基本上已经用我自己的事件处理程序替换了 onsubmit 事件。如果您想在每次更改选择控件时做出响应，只需将处理程序附加到 change() 事件，如下所示：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        // NOTE CHANGE IN NEXT TWO LINES
        $('select').change(function(){
            $.post("myFormResponder.php",{status: $(this).val()}, function(data, textStatus, xhr){
                // Again, do what ya gotta do, if ya gotta do it
            });
            return false; // Cancel default submit action
        });
    });
</script>