How to load fields from the viewmodel dynamically in asp.net core mvc

0

I have a 1: N relationship between the Person and Contacts classes. In my view edit, I get a viewmodel containing a list of contacts. In my View, I made a for which you should scroll through the contact list and load a contact row dynamically. The problem is that I do not know how to do this in ASP.NET CORE MVC, because the tutorial on the net I saw, teaches to do using traditional asp.net as example:

@for (int i = 0; i < Model.Telefones.Count; i++)
 {
    <div class="row">
    <div class="col-md-2">
        @Html.HiddenFor(model => model.Telefones[i].Id, new { @class = "hid-id" })
        @Html.EditorFor(model => model.Telefones[i].DDD, new { htmlAttributes = new { @class = "form-control txt-ddd" } })
    </div>
    <div class="col-md-6">
        @Html.EditorFor(model => model.Telefones[i].Numero, new { htmlAttributes = new { @class = "form-control txt-numero" } })
    </div>
    <div class="col-md-3">
        @Html.EnumDropDownListFor(model => model.Telefones[i].Tipo, new { @class = "form-control sel-tipo" })
    </div>
    <div class="col-md-1">
        <button class="btn btn-danger btn-remover-telefone" data-id="@Model.Telefones[i].Id">
            <span class="glyphicon glyphicon-trash"></span>
        </button>
    </div>
</div>

}

I tried to adapt my project in asp.net core, but the name of the view that is in the asp-for marker is underlined by red breaking the compilation.

@for (int i = 0; i < Model.PessoasContatosViewModel.Count(); i++)
{
   <div class="row align-items-center">
    <div class="col-md-2">
        <label asp-for="PessoaContatoViewModel[i].ContatoTipoId" class="control-label sel-contatoTipo">Tipo de Contato</label>
        <select asp-for="PessoaContatoViewModel[i].ContatoTipoId" data-plugin="selectpicker" title="Selecione uma opção" class="form-control show-tick show-menu-arrow sel-contatoTipo"></select>
    </div>
    <div class="col-md-4">
        <label asp-for="PessoaContatoViewModel[i].Contato" class="control-label txt-contato">Contato</label>
        <input type="text" asp-for="PessoaContatoViewModel[i].Contato" class="form-control txt-contato" />
    </div>
    <div class="col-md-2">
        <label class="control-label">&nbsp;</label>
        <div class="checkbox-custom checkbox-default">
            <input type="checkbox" asp-for="PessoaContatoViewModel[i].ContatoPrincipal" class="ckb-contatoPrincipal" checked autocomplete="off" />
            <label asp-for="PessoaContatoViewModel[i].ContatoPrincipal class=" ckb-contatoPrincipal">Contato Principal</label>
        </div>
    </div>
    <div class="col-md-3">
        <label asp-for="PessoaContatoViewModel[i].Detalhes" class="control-label txt-detalhes">Detalhes</label>
        <textarea asp-for="PessoaContatoViewModel[i].Detalhes" class="form-control txt-detalhes" />
    </div>
    <div class="col-md-1">
        <button type="button" class="btn btn-icon btn-default btn-outline btn-remover-contato" style="margin-top: 30px;"><i class="icon wb-trash" aria-hidden="true"></i></button>
    </div>
</div>

}

The result of for must be conformed to the image, with information coming from ViewModel.

Does anyone know how to do this?

Thank you:)

    
asked by anonymous 30.08.2018 / 00:11

1 answer

0

I saw there in the comments that your for works in View and not Partial right?

Why does not a wheel run out of Partial then leave it just as an item it's going to add?

@for (int i = 0; i < Model.Telefones.Count; i++)
{
      Html.Partial("_SuaPartial", Model.Telefones[i])
}
    
30.08.2018 / 16:16