Dynamic fields on form asp net core

Question

I need some help to solve this issue, I don't know how to figure out. Basically I want to add dynamic fields on form but I can't bind the values on Submit Post. The list is always null, don't have values.

Basically I have a view model with some fieds and one list.

My PlanoAcaoViewModel:

public class PlanoAcaoViewModel
{
  public int IdPlanoAcao { get; set; }
  public int Numero { get; set; }
  public DateTime DataEncerramento { get; set; }

  public List<PlanoEvidenciaIForm> ListaPlanoEvidenciaIForm { get; set; }

  public class PlanoEvidenciaIForm
  {
    public int IdPlanoAcaoEvidencia { get; set; }
    public IFormFile Arquivo { get; set; }
    public string Nota { get; set; }
    public DateTime Data { get; set; }
  }
}

My Controller:

[HttpPost]
public async Task<IActionResult> Create(PlanoAcaoViewModel model)
{
  var num = model.Numero;              // It's ok, return the right number
  var data = model.DataEncerramento ;  // It's ok, return the right date

  foreach (var it in model.ListaPlanoEvidenciaIForm)
  {
    // model.ListaPlanoEvidenciaIForm is NULL
  }
}

My cshtml:

@model ProjetoGestor.ViewModel.PlanoAcaoViewModel

<form asp-action="Create" enctype="multipart/form-data">
  <div asp-validation-summary="ModelOnly" class="text-danger"></div>
  <div class="row">
    <div class="col-auto">
      <label asp-for="Numero" class="control-label"></label>
      <input asp-for="Numero" class="form-control" disabled type="text" />
    </div>
    <div class="col-auto">
      <label asp-for="DataEncerramento" class="control-label"></label>
      <input asp-for="DataEncerramento" class="form-control" type="date" placeholder="dd/mm/yyyy" />
      <span asp-validation-for="DataEncerramento" class="text-danger"></span>
    </div>
  </div>
  <div class="row">
    @* Dynamic Fields *@
    <input asp-for="ListaPlanoEvidenciaIForm[0].Arquivo" class="form-control" type="file" />
    <input asp-for="ListaPlanoEvidenciaIForm[0].Nota" class="form-control" />
  </div>
  <div class="row col-auto">
    <div class="align-center">
      <a class="btn btn-primary btn-xl" asp-action="Index">Voltar</a> |
      <input type="submit" value="Criar" class="btn btn-primary btn-success btn-xl" />
    </div>
  </div>
</form>

And the dynamic fields I already tried a lot of ways but without success:

// In this way the model.ListaPlanoEvidenciaIForm is NULL
<input asp-for="ListaPlanoEvidenciaIForm[0].Arquivo" class="form-control" type="file" />
<input asp-for="ListaPlanoEvidenciaIForm[0].Nota" class="form-control" />

// In this way don't do it the POST (don't call the method create post)
<input name="ListaPlanoEvidenciaIForm[0].Arquivo" class="form-control" type="file" />
<input name="ListaPlanoEvidenciaIForm[0].Nota" class="form-control" />

// In this way the model.ListaPlanoEvidenciaIForm have length > 0 but all values inside list are null
<input name="ListaPlanoEvidenciaIForm" class="form-control" type="file" />
<input name="ListaPlanoEvidenciaIForm" class="form-control" />

In this way also don't call the method creat post:

Show us the form with dynamic fields. Right now your form doesn't have any 'ListaPlanoEvidenciaIForm' inside of them — Train
– Train, Commented Feb 11, 2020 at 23:34

devielu · Accepted Answer · 2020-02-12 06:03:14Z

1

From https://learn.microsoft.com/en-us/aspnet/core/mvc/models/file-uploads?view=aspnetcore-3.1;

When uploading files using model binding and IFormFile, the action method can accept:

A single IFormFile.

Any of the following collections that represent several files:

IFormFileCollection

IEnumerable<IFormFile>

List<IFormFile>

There's no mention of a list of objects, each containing an IFormFile. So you may be hitting a limitation of MVC binding. I'd suggest you try to split the list of files from the other values;

  public List<PlanoEvidenciaIForm> ListaPlanoEvidenciaIForm { get; set; }
  public List<IFormFile> Arquivos { get; set; }

  public class PlanoEvidenciaIForm
  {
    public int IdPlanoAcaoEvidencia { get; set; }
    public string Nota { get; set; }
    public DateTime Data { get; set; }
  }

    <!-- The IFormFile doesn't use [ ] -->
    <input asp-for="Arquivos" class="form-control" type="file" />
    <input asp-for="ListaPlanoEvidenciaIForm[0].Nota" class="form-control" />

edited Feb 12, 2020 at 6:03

devielu

1981 gold badge3 silver badges16 bronze badges

answered Feb 12, 2020 at 2:51

Jeremy Lakeman

11.6k30 silver badges34 bronze badges

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

1 Comment

devielu Over a year ago

Thanks a lot! You solve my problem. I will solve one thing in your code to works 100%

Collectives™ on Stack Overflow

Dynamic fields on form asp net core

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related