So I'm working on a social networking Facebook type proof of concept project for college and I'm trying to get a Bootstrap, multi-button input group to display properly for a comment box.

I would like to have the text area, with a Comment and Like button on the right hand side, with the whole input group filling the width of the panel as seen below.

Trying to achieve this!

The problem is when I add in my <form> tags, the formatting of the entire group within <div class="row"> goes crazy and forms a little box on the left hand side (screenshot below). If I take out the <form> tags formats properly, but I'm just not sure how to manage the <form> tags/where to put them to achieve this multi-button group.

How it displays currently

The code below is a few undos later to when the forms weren't broken, just so you know this isn't how I originally went about achieving it, but what i've succumbed to for now.

If anyone knows how to achieve this I'd be so grateful!

while($row = mysqli_fetch_assoc($result)) {

        //Get relative timestamp for current post
        $timestamp = strtotime($row['StatusTimestamp']);
        $stampRelative = CheckTimestamp($timestamp);

        echo '<div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">'.$row['UserName'].'<small class="postTimestamp"> '.$stampRelative.'</small></h3>
                </div>
                <div class="panel-body">
                    '.$row['StatusContent'].'
                </div>
                <div class="panel-footer clearfix">';
        echo '      <div class="row">
                        <div class="col-lg-11">
                            <div class="input-group">
                                <form action="'.CommentOnStatus($row['StatusID']).'" method="post">
                                    <input type="text" class="form-control" name="comment" placeholder="Post a comment...">
                                    <span class="input-group-btn">
                                        <button class="btn btn-default" type="submit">Comment</button>
                                        <input type="hidden" name="statusId" value="'.$row['StatusID'].'">
                                    </span>
                                </form>
                            </div>
                        </div>
                        <div class="col-lg-1">
                            <form action="'.LikeStatus($row['StatusID']).'" method="post">
                                <button type="submit" id="like" name="'.$row['StatusID'].'" class="btn btn-primary pull-right">Like</button>
                            </form>
                        </div>
                    </div>
                </div>
              </div>';
    }

form表单里action="?"是提交到哪里（是本地吗）？

弱小无助但能胡扯

3个回复