jQuery在php foreach循环中运行一次

时间:2015-12-27 09:23:38

标签: javascript php jquery codeigniter

使用Codeigniter 3.0.3

在视图中有一个foreach循环来获取数据库中的所有帖子,并且在每个循环的末尾都有一个带有post id的表单,用于将数据发布到控制器以将其插入到数据库中的comments_table

但是表单仅适用于第一个帖子或第一个循环,但另一个循环不起作用

内部模型我只需要来自会话的评论者ID和来自post-id attr的post id和来自input [type =" text"]的comment_text,使用comment-text调用

这里的javascript

<script type="text/javascript">
$(document).ready(function() {
    $('#addcommentajax').submit(function() {
        var commenter_id = "<?php echo $this->session->userdata('id'); ?>";
        var comment_text = $("#comment-text").val();
        var post_id = $(this).attr('post-id');
            jQuery.ajax({
                type: "POST",
                url: "<?php echo base_url('home/addcomment'); ?>",
                dataType: "json",
                data: {commenter_id, post_id, comment_text},
                success: function(commented) {
                    if(commented == true) {
                        window.location.reload(true);
                        alert('commented');
                    }
                }
            });
    });
});
</script>

这里是php foreach循环,用他自己的评论表单显示帖子

              <?php if($allposts): ?>
                    <?php foreach ($allposts as $post): ?>
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <div class="col-md-12" style="padding: 0;">
                                    <img class="img-rounded pull-left" src="<? echo base_url($post->image) ?>" width=30px height=30px>
                                    <div style="margin-top: 5px;">
                                        <a href="<? echo base_url('home?p=Profile&u='.$post->post_author) ?>"><small style="margin-left: 5px;"><?=$post->post_author?></small></a>
                                        <span style="font-size: 75%;" class="text-muted pull-right"><span class="fa fa-clock-o"></span>
                                        <?php $post_date = $post->post_date; $now = time(); $units = 1; ?>
                                            <? echo timespan($post_date, $now, $units) ?>
                                                ago</span>
                                    </div>
                                </div>
                                <div class="clear"></div>
                                <hr class="myown">
                                <div class="col-md-12 text-muted"><small><?=$post->post_text?></small></div>
                                <div class="clear"></div>
                                <hr class="myown">
                                <div class="btn-group">
                                    <?php if($this->users_model->liked($post->pid)): ?>
                                        <a class="btn btn-default btn-sm disabled"><span class="fa fa-check"></span> Liked</a>
                                        <?php else: ?>
                                            <a class="btn btn-default btn-sm like-btn" post-id="<?=$post->pid?>"><span data-toggle-tooltip="tooltip" data-placement="top" title="Like" class="fa fa-thumbs-up fa-lg"></span></a>
                                            <?php endif; ?>
                                                <a class="btn btn-default btn-sm" data-toggle="collapse" data-target="#<?=$post->pid?>Comment"><span data-toggle-tooltip="tooltip" data-placement="top" title="Comment" class="fa fa-comment fa-lg"></span></a>
                                                <a class="btn btn-default btn-sm"><span data-toggle-tooltip="tooltip" data-placement="top" title="Share" class="fa fa-share fa-lg"></span></a>
                                </div>
                                <div class="pull-right-custom text-muted"><small><?=$post->post_likes?> Like - <?=$post->post_comments?> Comment</small></div>
                                <div class="clear"></div>
                                <div id="<?=$post->pid?>Comment" class="collapse">
                                    <br>
                                    <form name="addcommentajax" id="addcommentajax" post-id="<?=$post->pid?>" class="form-horizontal" role="form" method="POST">
                                        <div class="input-group">
                                            <input type="text" id="comment-text" class="form-control input-sm" placeholder="Add Comment">
                                            <span class="input-group-btn">
                            <button type="submit" class="btn btn-sm btn-default">Publish</button>
                        </span>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <?php endforeach; ?>
                            <?php endif; ?>

3 个答案:

答案 0 :(得分:0)

如上所述,您有重复的ID,这是不允许的。没有两个元素应该具有相同的id。

但是类可能会重复,因此将addcommentajax从id更改为类:

<form name="addcommentajax" post-id="<?=$post->pid?>" class="addcommentajax form-horizontal" role="form" method="POST">

在jQuery中,使用类选择器而不是id选择器。

$('.addcommentajax').submit(function() {...});

答案 1 :(得分:0)

表单的nameid属性为meant be unique。在循环中,您将为所有表单分配相同的ID和名称。因此,您的脚本首次出现。将您的表单名称更改为唯一名称,而不是使用id作为选择器为表单指定一个类。

例如:假设帖子ID是唯一的

<?php if($allposts): ?>
    <?php foreach ($allposts as $post): ?>
      ...................
      ...................
      <form name="addcommentajax<?=$post->pid?>" class="addcommentajax" data-post-id="<?=$post->pid?>" class="form-horizontal" role="form" method="POST">
..................
................
</form>
<?php endforeach; ?>
   <?php endif; ?>

在javascript中

$('.addcommentajax').submit(function() {
..........
.............
});

答案 2 :(得分:0)

通过更改每个循环的输入类名来解决

我在输入中使用了class="comment-<?php echo $post->pid; ?>"

更改java脚本

来自:

var comment_text = $("#comment-text").val();
var post_id = $(this).attr('post-id');

要:

var post_id = $(this).attr('post-id');
var comment_text = $(".comment-"+post_id).val();