How to pass Model from View to Controller, add items to list, pass back to view

Question

I have a partial view inside a form that append to the form each time a button is clicked. It is a text area with a set of responses. How can I pass my model from the view to the controller, add it to the list model and back to view?

I am passing ReviewFormViewModel I want to pass the ListAdhoc to the partial controller and add items to it then pass it back to the view.

public class ReviewFormViewModel
{
    ...// other fields
    public List ListAdhoc { get; set; }
}

public class AdhocViewModel
{
    public int? ReviewId { get; set; }
    public String AdhocQuestion { get; set; } //free form
    public int? SelectedAnswer { get; set; } // for binding int? for optional
    public String Comments { get; set; }
    public List ListAdhocOptions { get; set; }
}

public class AdhocOptionsVM
{
    public int AnswerId { get; set; }
    public String RatingName { get; set; }
    public Decimal Rating { get; set; }
    public String ActiveFl { get; set; }

}

controller for partial view

 public PartialViewResult Adhoc()
    {
        //pass model object on button click and add each item to the model everytime
        var AdhocObj = new AdhocViewModel();

        AdhocObj.ListAdhocOptions = new List();
        var query = db.dbQuestionOptions.Where(qo => qo.ActiveFl == "Y").OrderByDescending(qo => qo.Rating).ToList();

        foreach (var item in query)
        {
            var AdhocAnsOptionsVMObj = new AdhocOptionsVM();
            AdhocAnsOptionsVMObj.AnswerId = item.AnswerId;
            AdhocAnsOptionsVMObj.RatingName = item.RatingName;
            AdhocAnsOptionsVMObj.Rating = item.Rating;
            AdhocAnsOptionsVMObj.ActiveFl = item.ActiveFl;

            AdhocObj.ListAdhocOptions.Add(AdhocAnsOptionsVMObj);
        }


        return PartialView("Adhoc", AdhocObj);
}

and partial view that is using the ReviewFormViewModel aswell:


@using (Html.BeginCollectionItem("adhoc"))
{
    
        
            @Html.HiddenFor(m => m.ReviewId)
            @Html.HiddenFor(m => m.AdhocId)

            @Html.TextAreaFor(m => m.AdhocQuestion, htmlAttributes: new { @style = "width:650px", @placeholder = "Enter Adhoc Question here" })

        
        
            @foreach (var optAnswer in Model.ListAdhocOptions)
            {
                
                    @Html.RadioButtonFor(m => m.SelectedAnswer, optAnswer.AnswerId, new { id = optAnswer.AnswerId }) @optAnswer.RatingName

                
            }
            @Html.ValidationMessageFor(m => m.SelectedAnswer)



            @Html.TextAreaFor(m => m.Comments, htmlAttributes: new { @style = "width:650px", @placeholder = "Comments" })


        
        
    

}

main view

@model CustomerFeedback.Areas.ProjectManagers.Models.ReviewFormViewModel

@{
    ViewBag.Title = "CreateFormsIndex";
}

Project Review Form


    
        
            
                
                    @Html.DisplayName(Model.ProjectId) @Html.DisplayName(Model.ProjectName)
                
                
                    PM: @Html.DisplayName(Model.FullName)
                
            
        
    



    

    
        @using (Html.BeginForm())
        {

            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            @Html.HiddenFor(m => m.ProjectId)
            @Html.HiddenFor(m => m.AccountId)
            @Html.HiddenFor(m => m.ReviewDate)

            
                
                    
                        
                            
                                Required Questions
                            
                        
                        @for (int i = 0; i < Model.ListReqQuestions.Count; i++)
                        {
                            
                                
                                    @Html.HiddenFor(m => m.ListReqQuestions[i].QuestionId)
                                    @Html.DisplayFor(m => m.ListReqQuestions[i].QuestionText)
                                
                                
                                    @foreach (var optAnswer in Model.ListReqQuestions[i].ListQuestionOptions)
                                    {
                                        
                                            @Html.RadioButtonFor(m => m.ListReqQuestions[i].SelectedAnswer, optAnswer.AnswerId, new { id = optAnswer.AnswerId }) @optAnswer.RatingName

                                        
                                    }
                                    @Html.ValidationMessageFor(m => m.ListReqQuestions[i].SelectedAnswer)



                                    @Html.TextAreaFor(m => m.ListReqQuestions[i].Comments, htmlAttributes: new { @style = "width:650px", @placeholder = "Comments" })


                                
                            
                        }

                        
                            
                                Optional Questions
                            
                        
                        @for (int i = 0; i < Model.ListOpQuestions.Count; i++)
                        {
                            
                                
                                    @Html.HiddenFor(m => m.ListOpQuestions[i].QuestionId)
                                    @Html.DisplayFor(m => m.ListOpQuestions[i].QuestionText)
                                
                                
                                    @foreach (var optAnswer in Model.ListOpQuestions[i].ListQuestionOptions)
                                    {
                                        
                                            @Html.RadioButtonFor(m => m.ListOpQuestions[i].SelectedAnswer, optAnswer.AnswerId, new { id = optAnswer.AnswerId }) @optAnswer.RatingName

                                        
                                    }
                                    @Html.ValidationMessageFor(m => m.ListOpQuestions[i].SelectedAnswer)



                                    @Html.TextAreaFor(m => m.ListOpQuestions[i].Comments, htmlAttributes: new { @style = "width:650px", @placeholder = "Comments" })


                                
                            
                        }
                        @*on click (new adhoc question) add a new freeform question with list of answers*@
                        
                            @* renders partial adhoc view *@
                        
                        

                        
                            
                        
                        

                        
                            
                            
                            
                            
                        

                    
                
            
        }

UPDATE: I've added the AdhocViewModel.

Ive added the view model for those properties. I have a form with a set of questions and responses to be answered. Those are from the database. I have a button, on click will generate the partial view and append to the form (can be many). The partial view consists of a text area (for any question entered), set of responses (from database) and a comment box. I am not sure how to handle this on post (submit). My attempt is to pass the model from the view to the partial controller, add items to it and pass it back to the view for processing. I am not have any success on passing model data

UPDATE 2 Updated code with using BeginCollectionItem helper. Added main view

user3559349 · Accepted Answer

The reason that the collection does not bind is because the parameter in BeginCollectionItem() must match the name of you property. Change it to

@using (Html.BeginCollectionItem("ListAdhoc")) // binds to List ListAdhoc

In addition you also need a loop in the main view to render existing AdhocViewModel in the collection. Even if none exist initially, it is still required in case you need to return the view because ModelState is invalid. In the main view include


    @foreach(var item in Model.ListAdhoc)
    {
        @Html.Partial("Adhoc", item)
    }

How to pass Model from View to Controller, add items to list, pass back to view

Answers (1)

Related Questions