PHP 和 jQuery 表单提交问题

我正在创建一个网站项目，您可以在发布帖子后对其进行编辑。我用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点击事件监听器，该监听器以表单(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 fadeIn效果(带有$postID(
jQuery只是以第二种形式淡出(post__edit(
第二个表单(post__edit(获取post__editHidden值(正确帖子的正确ID(，并将其分配给SESSION变量，该变量稍后可用于生成SQL UPDATE查询，该查询在第二个窗体最终提交时运行(到updatePost.php(

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

我是PHP和SQL的新手，所以我可能完全错了。无论如何，谢谢！

与其说这是一个答案，不如说是一个建议的替代方案

会话变量的使用在其他情况下会更有用，例如，我们可以混淆ID值或在孤立(断开连接(导航级别中重用它。。。

但在这种情况下，我最好只使用一个表单，并使用Ajax填充它的输入值。

这个Demo只更新postId'32的值…当它与一个获取Id并返回其jSon对象的函数动态ajax处理程序一起使用时，它应该可以工作。

$('.post__editBtn').click(function() {
var myform = $('.post__edit');
var postId=$(this).attr('data-id');
myform.find("input[name='post__editHidden']" ).val(postId);    

$.ajax({
type: "GET",
dataType: "json",
url: "https://api.myjson.com/bins/kx5xs", // replace with php later
data: {id: postId},
success: function(data) {
myform.find("input[name='postTitle']" ).val(data[0].title);
myform.find("textarea[name='postMsg']" ).val(data[0].content);
},
error : function(){
alert('Some error...!');
}
});

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


//for demo puropose to show the new value in the update form:
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">
Post 30<button type="button" data-id="30" class="post__editBtn">Edit post</button> 
</div>
<div class"post">   
Post 32<button type="button" data-id="32" class="post__editBtn">Edit post</button> 
</div>   
<div class"post">
Post 37 <button type="button" data-id="37" class="post__editBtn">Edit post</button> 
</div>      
<!--all data-id values would be replaced with '.$postID.' in the php loop-->

<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">Save Post</button>
<button class="post__edit-close">Close</button>
<input type="hidden" name="post__editHidden" value="">
</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"}

相关内容

最新更新

热门标签：