Question

我需要一个帮助来创建一个页面，您可以在其中查看来自mysql查询的数据。每一行都以div回显，并带有唯一的id。

<div class="column" id="<?php echo $row['id']; ?>">

它与mysql数据库中的数据具有相同的ID。每个div都包含一个编辑按钮：

<a href="edit_column.php?id=<?php echo $row['id'] ?>" class="edit">Edit</a>

点击＆＃39;编辑＆＃39;后，执行jQuery脚本：

$('.edit').on('click', function() {
            var url = this.href;
            var dialog = $("#dialog");
            if ($("#dialog").length == 0) {
                dialog = $('<div id="dialog" style="display:hidden"></div>').appendTo('body');
            }
            dialog.load(
                url,
                {},
                function(responseText, textStatus, XMLHttpRequest) {
                    dialog.dialog();
                }
                );
            return false;
        })

然后，弹出一个带有HTML表单的对话框，我甚至设法将MySQL数据放入该表单进行编辑。但现在我不知道如何继续。我该如何继续更新数据库中的数据？我知道如何使用PHP更新它，我甚至有一个PHP脚本update_column.php但我不知道如何从对话框中执行它并使用更新的数据刷新相应的div元素在浏览器中刷新整个页面。在edit_column.php中，我只有HTML表单和从MySQL数据库返回数据的PHP脚本。

Answer 1

您要做的就是添加事件以在您从第一个ajax调用获得的ajax表单中的某个项目上提交编辑表单，您还必须保存编辑ID，您可以将其保存到global var，

var editId;
$('.edit').on('click', function() {
        var url = this.href;
        editId = $(this).attr('id');
        var dialog = $("#dialog");
        if ($("#dialog").length == 0) {
            dialog = $('<div id="dialog" style="display:hidden"></div>').appendTo('body');
        }
        dialog.load(
            url,
            {},
            function(responseText, textStatus, XMLHttpRequest) {
                dialog.dialog();
            }
            );
        return false;
    });

/*
this is the event that will submit the ajax form
*/
    $('body').on('click', '#elementToSubmit', function() {
      formData = $('#ajaxForm').serialize();
      formData.id = editId;
      $.post('proccessEdit.php', formData, function(result) {// do something like hiding the modal or showing loading image

      });
    });

在你的php文件中，为特定id生成动态表单的那个必须看起来像这样

<form id="ajaxForm">
<!-- some inputs -->
</form>
<!-- this will submit the ajaxForm -->
<a id="elementToSubmit">Save modifications</a>

Answer 2

要解决这个问题，你需要使用ajax，ajax调用可以来回刷新你的服务器php脚本而不刷新页面。

http://www.w3schools.com/ajax/

http://www.w3schools.com/ajax/ajax_php.asp

Answer 3

如果要在不重新加载页面的情况下更新数据，则需要使用ajax请求。我看到你使用jQuery，所以你可以查看jQuery.ajax()。像$.ajax({ ... })这样的融合。我发现您在查找如何使用API方面没有任何问题，您可以在此处找到详细信息：http://api.jquery.com/jquery.ajax/

您将URL设置为通过POST发送一些参数的地址，然后，在该URL，您将拥有一个PHP函数，它将解析这些参数并从MySQL获取数据并返回您需要的数据在你的JavaScript中。

在jquery对话框中用html表单更新mysql中的数据

3 个答案: