How to create master-detail form using a Viewmodel

Question

I have a viewmodel in my project. Within it I have two entities that are a list of items.

I’m doing the data editing logic of these entities that are inside the viewmodel. I have 5 entities in all. Those that are not a list, I can popular the data in the relevant fields in view, now, the list ones I can’t. I can load the object and fill it, but I can’t pass this data to the view.

The codes I have are:

    public ActionResult Edit(int? id)
    {
        CliCliente cliente = db.CliCliente.Find(id);
        AnaAnamineseAlimentar anamnese = db.AnaAnamineseAlimentar.Find(id);
        RecRecordatorio recordatorio = db.RecRecordatorio.Find(id);
        List<RefRefeicao> refeicao = anamnese.RefRefeicao; //db.RefRefeicao.Find(id);
        List<QfaQuestionarioFrequenciaAlimentar> qfa = anamnese.QfaQuestionarioFrequenciaAlimentar;//= db.QfaQuestionarioFrequenciaAlimentar.Find(id);

        for (int i = 0; i < qfa.Count; i++)
        {
            qfa[i].AnaId = anamnese.AnaId;
            qfa[i].AnaAnamineseAlimentar = anamnese;
        }

        for (int i = 0; i < refeicao.Count; i++)
        {
            refeicao[i].AnaId = anamnese.AnaId;
            refeicao[i].AnaAnamineseAlimentar = anamnese;
        }

        AnamineseViewModel viewModel = new AnamineseViewModel() 
        {
            CliCliente = cliente,
            AnaAnamineseAlimentar = anamnese,
            RecRecordatorio = recordatorio,
            RefRefeicao = refeicao,
            QfaQuestionarioFrequenciaAlimentar = qfa
        };

        return View(viewModel);
    }

In the view:

@model NutriSport.Models.AnamineseViewModel

<div class="form-horizontal">
    <br />

    @Html.ValidationSummary(true, "", new { @class = "text-danger" })

    <table class="table">

        <tr class="success">
            <th>
                Tipo
            </th>

            <th>
                Horário/Local
            </th>

            <th>
                Alimentos/Quantidades
            </th>
        </tr>

        @for (int i = 0; i <= Model.RefRefeicao.Count; i++)
        {
            <tr class="success">

                <td>
                    @Html.TextBox(string.Format("RefRefeicao[{0}].RefTipo", i), null, new { @class = "form-control" })
                </td>

                <td>
                    @Html.TextBox(string.Format("RefRefeicao[{0}].RefHorarioLocal", i), null, new { @class = "form-control" })
                </td>

                <td>
                    @Html.TextArea(string.Format("RefRefeicao[{0}].RefAlimentosQuantidades", i), null,  new { @class = "form-control" })
                </td>
            </tr> 
        }
    </table>
</div>

Answer 1

In fact you can pass the data to the View yes. The problem is another: you are trying to put together a master-detail form and possibly not getting the way you need to get.

The principle of assembly is correct. There is a need to increase the intelligence of your code so that the form makes sense.

If it is a form, you need to write it down as one, ie:

@model NutriSport.Models.AnamineseViewModel

@using (Html.BeginForm())
{
    <div class="form-horizontal">
        <br />

        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        ... 

The next detail is how you write the form. You did it in the way that is correct, but unnecessarily laborious. In addition, to work properly the Binding of this form, you would need to indicate to Binder that the current record is index i. That is to say:

    @for (int i = 0; i <= Model.RefRefeicao.Count; i++)
    {
        <tr class="success">
            <input type="hidden" name="RefRefeicao.index" id="RefRefeicao_index" value="@i.ToString()" /> @* Isto aqui *@
            <td>
                @Html.TextBox(string.Format("RefRefeicao[{0}].RefTipo", i), null, new { @class = "form-control" })
            </td>

            <td>
                @Html.TextBox(string.Format("RefRefeicao[{0}].RefHorarioLocal", i), null, new { @class = "form-control" })
            </td>

            <td>
                @Html.TextArea(string.Format("RefRefeicao[{0}].RefAlimentosQuantidades", i), null,  new { @class = "form-control" })
            </td>
        </tr> 
    }

Done so, the Model Binder correctly identifies your element as an aggregate class object RefRefeicao.

Only, as I’ve said a few times, there is a component that solves this for you. I’ve talked about him many, many times. With it, you can assemble your list for the form as follows:

    @foreach (var refeicao in Model.RefRefeicao)
    {
        @Html.Partial("_Refeicoes", refeicao)
    }

In this case, you need to create a Partial which will have the following content:

_Refeicoes.cshtml

    @model NutriSport.Models.RefRefeicao

    @using (Html.BeginCollectionItem("RefRefeicao")) @* O nome precisa ser o mesmo que você definiu a List<RefRefeicao> no ViewModel *@
    {
        <tr class="success">
            <td>
                @Html.TextBoxFor(model => model.RefTipo), null, new { @class = "form-control" })
            </td>

            <td>
                @Html.TextBoxFor(model => model.RefHorarioLocal, null, new { @class = "form-control" })
            </td>

            <td>
                @Html.TextAreaFor(model => model.RefAlimentosQuantidades, i), null,  new { @class = "form-control" })
            </td>
        </tr> 
    }

The component creates the index for you. You don’t have to do anything else.

If everything was done right, by sending your <form> to the Controller who receives AnamineseViewModel for [HttpPost], you will see that RefRefeicao will be appropriately filled.