Question

在过去的两周里，我一直在疯狂地试图让它发挥作用。我正在调用MySQL Db，并在表中显示数据。一路上我正在创建删除和编辑记录的href链接。删除会提取警报并保持在同一页面上。 EDIT链接将POST数据然后重定向到editDocument.php

这是我的PHP：

 <?php
 foreach ($query as $row){
        $id =  $row['document_id'];
        echo ('<tr>');
        echo ('<td>' . $row [clientName] . '</td>');
        echo ('<td>' . $row [documentNum] . '</td>');

        echo "<td><a href='**** I NEED CODE HERE ****'>Edit</a>";

        echo " / ";
        echo "<a href='#' onclick='deleteDocument( {$id} );'>Delete</a></td>";
        // this calls Javascript function deleteDocument(id) stays on same page
        echo ('</tr>');   
 } //end foreach
 ?>

我试过（没有成功）AJAX方法：

<script>
function editDocument(id){
  var edit_id = id;
     $.ajax({
        type: 'POST',
        url: 'editDocument.php',
        data: 'edit_id='edit_id,
        success: function(response){
          $('#result').html(response);
        }
     });
}
</script>

我一直在editDocument.php上使用<? print_r($_POST); ?>来查看id是否已发布。

我意识到我需要使用jQuery / AJAX。我不确定是否需要使用onclick，.bind，.submit等。

以下是我需要的代码的参数：

发布$ id值：$_POST[id] = $id
重定向到editDocument.php（我将使用$ _POST [id]）。
不影响页面上的其他<a>或任何其他标记。
如果需要，我希望AJAX“虚拟”创建任何<form>。我不想把它们放在我的PHP代码中。
我不想使用按钮。
我不想使用$ _GET。

我不知道我错过了什么。我一直在搜索stackoverflow.com和其他网站。我一直在尝试示例代码。我想我“看不到森林穿过树林。”也许是一双不同的眼睛。请帮忙。

提前谢谢。

更新

根据Dany Caissy的说法，我不需要使用AJAX。我只需要$ _POST [id] = $ id;并重定向到editDocument.php。然后，我将使用editDocument.php上的查询来创建粘性表单。

Answer 1

当您需要与数据库通信而不重新加载页面时，会使用AJAX，因为您的网站上有某些用户操作。

在您的情况下，您希望重定向页面，在使用AJAX修改数据库之后，它没有多大意义。

你应该做的是将你的数据放在一个表单中，你的表单的动作应该通向你的EditDocument，这个页面将处理你的POST / GET参数，并做你需要完成的任何数据库交互。

简而言之：如果您认为在AJAX调用后需要重定向用户，则不需要AJAX。

Answer 2

您的SyntaxError: Unexpected identifier请求中有$.ajax();

<script>
function editDocument(id){
  var edit_id = id;
     $.ajax({
        type: 'POST',
        url: 'editDocument.php',
        data: 'edit_id='edit_id,
        success: function(response){
          $('#result').html(response);
        }
     });
}
</script>

应该是这样的

<script>
function editDocument(id){
  var edit_id = id;
     $.ajax({
        type: 'POST',
        url: 'editDocument.php',
        data: {edit_id: edit_id},
        success: function(response){
          $('#result').html(response);
        }
     });
}
</script>

请注意'edit_id='edit_id,我已经改变了，如果您希望它是一个字符串，那么它就像这个'edit_id = ' + edit_id一样，但它常见于使用像{edit_id: edit_id}这样的对象或{'edit_id': edit_id}

你也可以像这样使用表格作为编辑按钮

<form action="editDocument.php" method="POST">
   <input type="hidden" name="edit_id" value="272727-example" />
   <!-- for each data you need use a <input type="hidden" />  -->
   <input type="submit" value="Edit" />
</form>

或在Javascript中你可以这样做

document.location = 'editDocument.php?edit_id=' + edit_id;

这将自动重定向用户

Answer 3

鉴于你的评论，我认为你可能正在寻找这样的东西：

<a href='#' class="editLink" data-id="123">Edit</a>

$(document).ready(function() {
    $('.editLink').click(function(e) {
        e.preventDefault();
        var $link = $(this);
        $('<form/>', { action: 'editdocument.php', method: 'POST' })
            .append('<input/>', {type:hidden, value: $link.data('id') })
            .appendTo('body')
            .submit(); 
    });
});

现在，我不一定同意这种方法。如果您的用户有权使用给定的ID编辑项目，则无论是直接访问它（例如通过书签）还是单击列表中的链接都无关紧要。您所需的方法还会阻止用户在新标签页中打开链接，我个人觉得这些链接非常烦人。

修改 - 另一个想法：

也许当用户点击编辑链接时，它会弹出一个编辑表单，其中包含要编辑的项目的详细信息（如有必要，可通过ajax将详细信息检索为JSON）。不是一个新页面，就像列表页面顶部的jQuery模式一样。当用户点击提交时，通过ajax发布所有编辑的数据，并更新sql数据库。我认为这将是一种更加用户友好的方法，可以满足您的要求。

Answer 4

我遇到了同样的问题。我还希望在ajax发布后重定向到新页面。所做的只是改变了成功：回调到这个

success: function(resp) {
        document.location.href = newURL; //redirect to the url you want
    }

我知道它违背了ajax的全部目的。但我必须从几个选择框中获取价值，而不是传统的提交按钮，我有一个定制的锚定链接与自定义样式。所以赶紧发现这是一个可行的解决方案。

ajax $ _POST数据然后重定向到新页面

4 个答案: