PHP & jQuery 表单提交问题

Question

我正在创建网站项目，您可以在帖子发布后对其进行编辑。我已经使用 PHP、SQL 和 jQuery 创建了网站，并且所有发布到该网站的帖子都通过 while 循环（不包括在此问题内容中）输出到网站“提要”。所有帖子在发布时（在数据库中）都有一个唯一的 ID。

我现在遇到的问题是第二种形式（post__edit）根本没有提示。

我发现我需要在<input type="hidden" value="$postID">字段中传递帖子的 id。下面的这个表单只是提示用于提交帖子更改的实际post_edit表单。

echo '

 <form method="post"> 

   <button type="button" class="post__editBtn">Edit post</button> 

   <input type="hidden" name="post__editHidden" value="'.$postID.'">

 </form>';

当按钮类：post__editBtn被点击时，会触发一个 jQuery click 事件监听器，该事件监听器会以淡入淡出的形式（post_edit）让您对帖子进行更改并提交它们。

$('.post__editBtn').click(function() {

    $('.post__edit').fadeIn();

});

然后我有一个 PHP if 语句来检查隐藏值是否已设置。如果有，那么我会回显先前隐藏的表单，并分配一个 SESSION 变量以供稍后在执行 UPDATE 查询时使用。

if(isset($_POST['post__editHidden'])) {

  $_SESSION['post__editHidden'] = $_POST['post__editHidden'];

  echo'

  <form method="post" action="../../php/includes/updatePost.php" class="post__edit">

   <input type="text" name="postTitle" placeholder="Edit title" required>

   <textarea name="postMsg" maxlength="255" placeholder="Edit message" required></textarea>

   <button type="submit">Edit Post</button>

   <button class="post__edit-close">Close</button>

  </form>';

 }

总结

• 第一个表单触发正确帖子的 jQuery 淡入效果（使用$postID）

• jQuery 只是以第二种形式淡出（post__edit）

• 第二种形式（post__edit）获取post__editHidden值（正确帖子的正确 ID）并将其分配给 SESSION 变量，该变量稍后可用于进行 SQL UPDATE 查询，该查询在最终提交第二种形式时运行（到 updatePost. php）。

我相信因为我设置了第一个表单按钮，type="button"所以它不会提交表单，所以isset($_POST['post__editHidden']不会运行。但是，如果我将按钮更改为正常的提交类型，那么第一个表单就会出现并重新加载它所在的页面。我可能只是e.preventDefault在我的 jQuery fadeIn 中，但我不知道这是否有效。

我对 PHP 和 SQL 很陌生，所以我可能全都错了。不管怎么说，多谢拉！

Answer 1

这更像是一个建议的替代方案，而不是一个答案。会话变量的使用在其他情况下会更有用，例如我们可以混淆 ID 值或在孤立（断开连接）导航级别中重用它......但在这种情况下，我最好只使用一个表单并使用 Ajax 填充它的输入值。此演示仅更新 postId' 32 的值......当它与获取 Id 并返回它的 jSon 对象的功能性动态 ajax 处理程序一起使用时，它应该可以工作。$('.post__editBtn').click(function() {var myform = $('.post__edit');var postId=$(this).attr('data-id');&nbsp; &nbsp; myform.find("input[name='post__editHidden']" ).val(postId);&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type: "GET",&nbsp; &nbsp; &nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; &nbsp; &nbsp; url: "https://api.myjson.com/bins/kx5xs", // replace with php later&nbsp; &nbsp; &nbsp; &nbsp; data: {id: postId},&nbsp; &nbsp; &nbsp; &nbsp; success: function(data) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;myform.find("input[name='postTitle']" ).val(data[0].title);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; myform.find("textarea[name='postMsg']" ).val(data[0].content);&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; error : function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;alert('Some error...!');&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; });&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; $('.post__edit').fadeIn();&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; //for demo puropose to show the new value in the update form:&nbsp; &nbsp; console.log($(".post__edit input[name='post__editHidden']").val());});.post__edit{display:none;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class"post">&nbsp; &nbsp;Post 30<button type="button" data-id="30" class="post__editBtn">Edit post</button>&nbsp;&nbsp; &nbsp;</div><div class"post">&nbsp; &nbsp;&nbsp; &nbsp;Post 32<button type="button" data-id="32" class="post__editBtn">Edit post</button>&nbsp;</div>&nbsp; &nbsp;<div class"post">&nbsp; &nbsp; &nbsp;Post 37 <button type="button" data-id="37" class="post__editBtn">Edit post</button>&nbsp;</div>&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<!--all data-id values would be replaced with '.$postID.' in the php loop-->&nbsp;&nbsp;<form method="post" action="../../php/includes/updatePost.php" class="post__edit">&nbsp; &nbsp;<input type="text" name="postTitle" placeholder="Edit title" required>&nbsp; &nbsp;<textarea name="postMsg" maxlength="255" placeholder="Edit message" required></textarea>&nbsp; &nbsp;<button type="submit">Save Post</button>&nbsp; &nbsp;<button class="post__edit-close">Close</button>&nbsp; &nbsp; <input type="hidden" name="post__editHidden" value="">&nbsp; </form>然后我们添加一个文件 ex:ajax.php，我们用 ajax 调用它，我们在其中获得一个 ID，我们确实从数据库中获取该记录以返回我们的 json。像这样的东西：<?php$id=$_GET['id'];$stmt = $conn->query("SELECT title,content * FROM posts WHERE postId=$id LIMIT 1");$result=...echo json_encode($result);要获得这样的json：{"id": "32","title": "POst 32","content": "POst 32 talks about HiTECH"}