ASP.NET MVC 3 Adding comments in article view

Question

I have article model with public ICollection<Comment> Comments { get; set; } and comment model. I have created view for article (Details view) and I want to show everything from model article (not problem) and comments to article to and after comments then show form for adding comment to article (not in other page, I want it in the view with article). For now I have this:

@model SkMoravanSvitavka.Models.Article

@{
    ViewBag.Title = "Zobrazit";
}

<h2>Zobrazit</h2>

<fieldset>
    <legend>Article</legend>

    <div class="display-label">Title</div>
    <div class="display-field">@Model.Title</div>

    <div class="display-label">Text</div>
    <div class="display-field">@Model.Text</div>

    <div class="display-label">PublishedDate</div>
    <div class="display-field">@String.Format("{0:g}", Model.PublishedDate)</div>
</fieldset>

@if (Model.Comments != null)
{
    foreach (var comment in Model.Comments)
    {
        @Html.Partial("_Comment", comment)
    }
}



<p>
    @Html.ActionLink("Edit", "Edit", new { id = Model.ArticleID }) |
    @Html.ActionLink("Back to List", "Index")
</p>

It shows article and there is partial view for all comments to article. And now I am not sure how to add form for adding comments. Thank you

Edit: Here is my comment controller and create methods (vytvorit = create in czech :) ):

 public ActionResult Vytvorit(int articleID)
        {
            var newComment = new Comment();
            newComment.articleID = articleID; // this will be sent from the ArticleDetails View, hold on :).
           newComment.Date = DateTime.Now;
            return View(newComment);  
        } 

        [HttpPost]
        public ActionResult Vytvorit(Comment commentEntity)
        {
                db.Comments.Add(commentEntity);
                db.SaveChanges();
                return RedirectToAction("Zobrazit", "Clanek", new { id = commentEntity.articleID });
        }

When I change @Html.RenderAction to @Html.Action it works. It is showing textbox for comment and I can add comment but there is problem that it not just add textbox but it add my site again (not just partial view but all view) and I am sure I add Create view for comment as partial.

Mohammed Swillam · Accepted Answer · 2011-03-28 10:29:26Z

Create a new Partial view, make it a strongly typed one of type Comment.

from the scaffolding templates, choose "Create" template.

handle the normal add new scenario of the comment.

add this Partial view to the Article details page.

Note that when you are about to save a new comment, you will need to get the hosting Article ID.

Hope it's now clear, if not, let me know.

update: assuming that you will add the "AddComment" partial view to your "Article details" view, you can do the following in order to add the comment.

1- Modify the GET (Create) action inside your CommentController as the following:

public ActionResult Create(int articleID)
    {
            var newComment = new CommentEntity();
            newComment.articleID = articleID; // this will be sent from the ArticleDetails View, hold on :).

            return View(newComment);            
    }

1- make the POST (Create) action like this:

[HttpPost]
public ActionResult Create(Comment commentEntity)
{
    // Complete the rest..
}

2- The Partial view for the comment will look something like this:

@model NGO.Models.Comment

@using (Html.BeginForm())
        {            
            @Html.ValidationSummary(true)
            <div class="addcommentbox">
                <h2> Add Comment </h2>
                @Html.TextAreaFor(model => model.Description)
                <div class="ErrorMessage">
                @Html.ValidationMessageFor(model => model.Description)
                </div>                    
                <input id="addComment" type="button" onclick="" value="Add" />
            </div>

        }

3- inside the ArticleDetails page, in the desired place that you need the add comment section to show, use RenderAction method to render the AddComment Partial view like the following:

Html.RenderAction("Create", "Comment",new {articleID = Model.ID});

the previous line will call the GET(Create) action inside CommentColtroller and pass the current Article ID, so the AddComment Partial view will come already populated with the current Article ID (and this is what we want).

that's it, feel free to ask me if it's not clear yet, and do let me know if it worked for you

I created partial view for comment, add to article and it´s ok. But I am not sure how to handle ArticleID. My comment looks like this public virtual int CommentID { get; set; } public virtual string Text { get; set; } public virtual DateTime Date { get; set; } I hope it is okay. I add POST from Details to controller: [HttpPost] public ActionResult Zobrazit(Comment newComment) { db.Comments.Add(newComment); return RedirectToAction("Index"); }
Great update thanks, but I have problem with RenderAction, it shows error: Compiler Error Message: CS1502.
most probably it's related to your action result, can you post the Comment controller Create code ? (both get and post)

tugberk · Accepted Answer · 2011-03-28 16:22:09Z

I strongly recommend you to create view model for your article page. like below one;

public class ArticleViewModel { 

     public Article _article {get;set;}
     //this is for the comment submit section
     public Comment _comment {get;set;}
     //this for the comments that you will view
     public IQueryable<Comment> _comment {get;set;}         

}

after that, pass this to your view from your controller and make your view strongly-typed to this ArticleViewModel class.

Create a section which is wrapped inside form tag as below;

@using(Html.BeginForm()){

     @*Put your code inside here.
       Create inputs for sending comments. like below;*@
     @Html.TextboxFor(Model._comment.Content)

}

and then create a method for that;

[HttpPost]
[ActionName("name_of_your_article_page_action")]
public ActionResult Create(Comment commentEntity) {

}

NOTE : Of course, you do not need to create a seperate viewmodel. you can hardcode the name your inputs but this makes it hard to use validation and other kind of things. but not impossible to use validation though !

Collectives™ on Stack Overflow

ASP.NET MVC 3 Adding comments in article view

2 Answers 2

8 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Linked

Related