Faisal Shahab Faisal Shahab - 1 month ago 12
ASP.NET (C#) Question

how to display the comments under the post

I Have problem in my project i'm new in MVC so plz help me out. I have problem to display the comments under the relevant the Post like we have post in face book and we comment just under the post and it display, I Have displayed and listed all the posts and under this i have displayed the comments field, i just want to know how the relevant comment can be displayed,
View

@foreach (Post item in Model.posts)
{
foreach(Comment c in item.comments)
{
<div>

<p>
@item.Body
</p>
<p>@item.timeDate</p>
<p>@c.Body</p>

</div>
using (Html.BeginForm("CreateComment", "Posts", FormMethod.Post))
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)

<fieldset>
<legend>Comment</legend>

<div class="editor-label">
@Html.LabelFor(model => model.comment.Name)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.comment.Name)
@Html.ValidationMessageFor(model => model.comment.Name)
</div>

<div class="editor-label">
@Html.LabelFor(model => model.comment.Email)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.comment.Email)
@Html.ValidationMessageFor(model => model.comment.Email)
</div>

<div class="editor-label">
@Html.LabelFor(model => model.comment.Body)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.comment.Body)
@Html.ValidationMessageFor(model => model.comment.Body)
</div>

<div class="editor-label">
@Html.LabelFor(model => model.comment.dateTime)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.comment.dateTime, new { id = "datepicker", @Value = @DateTime.Now })
@Html.ValidationMessageFor(model => model.post.timeDate)
</div>
<div class="editor-field">
<input type ="text" hidden="hidden" value="@item.Id" name="txtpostId"/>
@Html.ValidationMessageFor(model => model.comment.PostId)
</div>

<p>
<input type="submit" value="Create"/>
</p>
</fieldset>
}
}
}


Controller

public ActionResult Index()
{
objVmPost.comment = new Comment();
objVmPost.post = new Post();
List<Post> mylist = db.Posts.Include(post => post.Comments).ToList();
objVmPost.posts = mylist;
return View("Index",objVmPost);
}
[HttpPost]
public ActionResult CreateComment(VmPost objVmpost)
{
objVmpost.comment.PostId = Convert.ToInt32(Request.Form["txtpostId"]);
db.Comments.Add(objVmpost.comment);
db.SaveChanges();
List<Post> mylist = objPostDb.GetAll().ToList();
objVmpost.posts = mylist;
return View("index", objVmpost);
}


Model

public partial class Comment
{
public int Id { get; set; }
public string Name { get; set; }
public string Email { get; set; }
public string Body { get; set; }
public System.DateTime dateTime { get; set; }
public int PostId { get; set; }

public virtual Post Post { get; set; }
}

public partial class Post
{
public Post()
{
this.Comments = new HashSet<Comment>();
this.Tags = new HashSet<Tag>();
}

public int Id { get; set; }
public System.DateTime timeDate { get; set; }
public string Body { get; set; }

public virtual ICollection<Comment> Comments { get; set; }
public virtual ICollection<Tag> Tags { get; set; }
}


This is the problem click here

Answer

In your controller you're doing this

List<Comment> cmntlist = db.Comments.ToList();

which translates into SQL

SELECT * FROM `comments`

so, you are not retreiving related comments, but all comments stored in database.

You could use lazy loading mechanism and your controller would look like this

public ActionResult Index()
{
    objVmPost.post = new Post();
    List<Post> mylist = db.Posts.ToList();
    objVmPost.posts = mylist;
    return View("Index",objVmPost);
}

or eager loading

public ActionResult Index()
{
    objVmPost.post = new Post();
    List<Post> mylist = db.Posts.Include(post => post.Comments).ToList();
    objVmPost.posts = mylist;
    return View("Index",objVmPost);
}

You can read more about lazy loading and eager loading

No matter which approach you would like to take, your foreach loops should look like this:

foreach(var post in Model.Posts){
    <p>@post.Body</p>
    <p>@post.timeDate</p>
    foreach(var comment in post.Comments){
        <p>@comment.Body</p>
    }
    // here you can add your comment form
}
Comments