我有查找所有用户帖子的数据库查询。然后,此查询用于创建forEach循环,该循环将为每个数据库结果创建一个帖子:
for($indexPost=0; $indexPost < $postCount; $indexPost++) {
//All information to do with the post
echo<<<_END
<form action="feedLikes.php" id="likePostForm" method="post">
<input type="hidden" name="feedIDForLike" class="feedIDForLike" value="$feedID">
<button type="submit" class="likeButton"></button>
</form>
_END;
}
我已经注释掉了所有的帖子信息,因为它加载时它完全显示出来。我遇到的问题是按下那个按钮时会执行以下ajax:
$(document).ready(function()
{
$('#likePostForm').on('submit', function (e) {
e.preventDefault();
likePost();
});
});
function likePost()
{
var feedIDLike = $(".feedIDForLike").val();
$.ajax({
url: "feedLikesClicked.php",
cache: false,
type: "POST",
data: {feedIDLike: feedIDLike},
dataType: "html",
success: function(html){
location.reload();
}
});
}
这种作品。当我按下like功能时,feedLikesClicked.php
内的代码就可以完成它的工作。但是,我目前在我的Feed中有5个帖子。当我在帖子上按下时,它会被输入数据库5次。这是因为按下like时的ajax调用是由每个帖子而不是我点击的那个帖子运行的。
我的问题是,当在循环中创建表单时,如何让这个单独的表单运行ajax?
感谢您的帮助,我希望这是有道理的。
我尝试的事情
由于每个表单ID必须是唯一的,我尝试将表单行更改为:
<form action="feedLikes.php" id="likePostForm$feedID" method="post">
然后将jquery的顶行改为:
var feedID = $(".feedIDForLike").val();
$('#likePostForm'+ feedID).on('submit', function (e) {
e.preventDefault();
likePost();
});
但不幸的是,结果相同
答案 0 :(得分:1)
我在表单中设置了一个数据属性,因此每个表单都有自己的集合,并且由于您使用的是onsubmit函数,因此可以将this
(表示所选表单)传递给likePost
然后,您可以轻松地从传递的元素中提取该data-feedID。代码的问题在于您选择了具有类feedIDForLike
的每个元素。
<?
for($indexPost=0; $indexPost < $postCount; $indexPost++) {
//All information to do with the post
echo<<<_END
<form action="feedLikes.php" id="likePostForm" data-feedID="{$feedID}" method="post">
<button type="submit" class="likeButton"></button>
</form>
_END;
}
?>
<script>
$(document).ready(function() {
$('#likePostForm').on('submit', function(e) {
e.preventDefault();
likePost(this);
});
});
function likePost(elem) {
var feedIDLike = elem.attr("data-feedID");
$.ajax({
url: "feedLikesClicked.php",
cache: false,
type: "POST",
data: {
feedIDLike: feedIDLike
},
dataType: "html",
success: function(html) {
location.reload();
}
});
}
</script>
答案 1 :(得分:0)
在提交函数中移动你的likePost()函数,并使用jquery的this和最接近的函数来获取变量。
$(document).ready(function()
{
$('#likePostForm').on('submit', function (e) {
e.preventDefault();
//try something like this
var feedIDLike = $(this).closest( ".feedIDForLike" ).val();
$.ajax({
url: "feedLikesClicked.php",
cache: false,
type: "POST",
data: {feedIDLike: feedIDLike},
dataType: "html",
success: function(html){
location.reload();
}
});
});
});