C# MVC - Razor Complex Nested Form Submission not binding

Question

Long time lurker... first time question asker... I have a complex form which returns null when being submitted. Essentially I am trying to build a database driven forms.

The form contains a list of either sections or questions A section contains a list of either another section, or questions

Model 1:
public FormViewModel {
    public List<FormSetsViewModel> formSets { get; set; }
}

Model 2: 
public FormSetsViewModel{
    QAViewModel questionAnswerViewModel { get; set; }
    SectionViewModel sectionViewModel { get; set; }
    bool isQuestion { get; set; }
    bool isSection { get; set; }
}

Model 3:
public SectionViewModel {
    public List<FormSectionQuestionsViewModel> formSectionQuestions { get; set; }
}

Model 4:
public FormSectionQuestionsViewModel {
    public QuestionAnswerViewModel questionAnswers;
    public SectionViewModel childSection;
    int orderNumber;
}

Model 5: 
public QAViewModel {
    int id { get; set; }
    string answer { get; set; }
    string question { get; set;}
}

The views are as follows:

FormViewModel.cshtml
@model FormViewModel
@using (Html.BeginForm("Save", "Forms"))
{
    <div class="row">
        @Html.EditorFor(model => model.formSetsViewModels)
    </div>

    <div class="controls">
        <input type="submit" value="Confirm" class="button" name="save" />
    </div>
}

@model FormSetsViewModel
<div class="control-group">
    @if (Model.isQuestion)
    {
        @Html.EditorFor(m => m.questionViewModel);
    }
    else
    {
        @Html.EditorFor(m => m.sectionViewModel);
    }
</div>

SectionViewModel.cshtml
@model SectionViewModel
@Html.EditorFor(m => m.formSectionQuestions)

FormSectionQuestionsViewModel.cshtml
@model FormSectionQuestionsViewModel
@if (Model.childSection != null)
{
    @Html.EditorFor(m => m.childSection)
}
else
{
    @Html.EditorFor(m => m.questionAnswers)
}

QAViewModel.cshtml
@model QAViewModel

<p><div class="question-text-edit">@Html.Raw(Model.questionText)</div>
@Html.TextAreaFor(m => m.answer, new { style = "width: 90%; height: 80px;" })

The controller:

[HttpPost]
public ActionResult Save(int caseID, List<FormSetsViewModel> formSets = null)
{
    return Index(caseID);
}

The view works great as a database driven form. However, when I submit the form, it seems that the formsets cannot bind, and returns null.

From Html, it created an input like this:

<input id="formSetsViewModels_d762713a-7a2f-497a-9417-4c6e91d33cb8__sectionViewModel_formSectionQuestions_48e738da-10d3-4518-be59-2493e2b7a7cc__questionAnswers_answer" name="formSetsViewModels[d762713a-7a2f-497a-9417-4c6e91d33cb8].sectionViewModel.formSectionQuestions[48e738da-10d3-4518-be59-2493e2b7a7cc].questionAnswers.answer" type="text" value="">

I believe that your issue has to do with using EditorFor on a List<> of objects — Michael Richardson
– Michael Richardson, Commented Nov 18, 2013 at 5:19
Hi There, I can tell that the EditorFor List<> objects is working for the simpler version of this. Though I am not sure about it in this case. — Leon
– Leon, Commented Nov 18, 2013 at 6:04

Leon · Accepted Answer · 2013-11-19 00:43:41Z

2

Finally found the answer!

The variable name for the FormSetsViewModel in the

public ActionResult Save(int caseID, List<FormSetsViewModel> formSets = null)

needs to be formSetsViewModel for the model to be able to be binded.

The other thing is that, some public variables in the class does not have { get; set; } method. All variables that we want to be bind needs the { get; set; } method. Adding this solve the issue.

answered Nov 19, 2013 at 0:43

Leon

411 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

C# MVC - Razor Complex Nested Form Submission not binding

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related