Multiple Models in 1 view

Question

User-295635300 posted

Hi,

I have a page that shows a list of posts of a blog (post model).

I want to create a "comment form" that create a single comment and add it  to a list of comments (comment model).

I can't use multiple models in a single view with that class:

namespace WebApplication1.Models
{
    public class ViewModel
    {
         public virtual ICollection<Comment> Comments { get; set; }
         public virtual Post Post { get; set; }

        public ViewModel(ICollection<Comment> _cs, Post _p)
        {
          Comments = _cs;
          Post = _p;
        }
    }
}

My solution was to create CRUD methods to the comment model. Now i have under the folder "comments" a create view that create a comment and it is handled by commentscontroller.

How can i "import" the htmlbeginform of the create page of model, into the blog view under the folder "blog".

I tried to use HtmlPartial and change HtmlBeginForm to AjaxBeginForm but it didn't worked.

Here is my view of the posts:

@model IEnumerable<WebApplication1.Models.Post>

@{
    ViewBag.Title = "BlogHomePage";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

    <div id="content">
    <!--Content of the blog-->
    @foreach (var post in Model)
    {
        <div id="mainContent">
            <section>
                <article class="blogPost">
                    <header>
                        <h2>@Html.DisplayFor(modelItem => post.PostTitle)</h2>
                        <p>Posted on @Html.DisplayFor(modelItem => post.PostDate) by <a target="_new" href=@Html.DisplayFor(modelItem => post.WebSite)>@Html.DisplayFor(modelItem => post.PostAuthor)</a> - <a href="#@Html.DisplayFor(modelitem => post.PostID)">@Html.DisplayFor(modelItem => post.Comments.Count) comments</a></p>
                    </header>
                    <div>
                        <p class="blogContent">@Html.DisplayFor(modelItem => post.PostText)</p>                  
                    </div>
                    @if (!post.PostImage.IsEmpty())
                    {                     
                            <img src="@Url.Content(post.PostImage)" alt="@post.PostAuthor" width="500" />                        
                    }
                    <br/>
                    @if (!post.PostVideo.IsEmpty())
                    {
                        <img src="@Url.Content(post.PostVideo)" alt="@post.PostVideo" width="500" />
                    }
                    
                </article>
                <!----creating an anchor on the page to point to comments of the post -->
                <a name="@Html.DisplayFor(modelitem => post.PostID)"></a>
            </section>
        </div>

        //Change background of odds comments
        bool counter = true;
        foreach (var comment in post.Comments)
        {
            if (counter)
            {
                counter = false;
            }
            else
            {
                counter = true;
            }

            <section id="@(counter==true ? "commentstrue":"comments")">
                <!--Comments of bloggers-->
                <article class="commentswidth">
                    <header>
                        <h3>@Html.DisplayFor(modelComment => comment.CommentTitle)</h3>
                        <a target ="_new" href=@Html.DisplayFor(modelComment => comment.CommentWebSite)>@Html.DisplayFor(modelComment => comment.CommentAuthor)</a>
                    </header>
                    <p>@Html.DisplayFor(modelComment => comment.CommentText)</p>
                </article>
            </section>
        }
        <br />
        
        <!--Comments form-->
        
        Here i want the comment form !!!!

    }
    </div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Creat page in comments folder:

@model WebApplication1.Models.Comment

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Create</h2>


@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        <h4>Comment</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.PostID, "PostID", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownList("PostID", null, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.PostID, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.CommentTitle, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CommentTitle, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CommentTitle, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.CommentAuthor, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CommentAuthor, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CommentAuthor, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.CommentWebSite, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CommentWebSite, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CommentWebSite, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.CommentText, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CommentText, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CommentText, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Thanks