Add dynamic form fields in ASP.NET Core MVC App

In my app I want to make model that can have dynamic list of attributes:

Provider class

using System;
using System.Collections.Generic;
namespace DynamicForms.Models

{

public class Provider

{

public String Name { get; set; }

public List<Attribute> Attributes { get; set; }
    public Provider()
    {
        Attributes = new List&lt;Attribute&gt;();
    }
}

}

My controller has two methods. One to add more attributes to current model and one to save Provider model. Method to add more attributes looks like this:

    [HttpPost]

// Add attribute to current provider model

public IActionResult Index(Provider provider)

{

provider.Attributes.Add(new Models.Attribute());

return View(provider);

}

And my view looks like this:

@model Provider

@using (Html.BeginForm())

{

<div>

@Html.TextBoxFor(m => m.Name)

<input type=“submit” value=“Add attribute” formmethod=“post”/>

</div>

<div>

@foreach ( var attribute in Model.Attributes)

{

<div>

@Html.TextBoxFor(a => attribute.Name)

@Html.TextBoxFor(a => attribute.Value)

</div>

}

</div>

<div>

<input type=“submit” value=“Save form” formaction=“Provider/Save” formmethod=“post”/>

</div>

}

When I press “Add attribute” button attribute is added and a row of input fields is appearing. However when i press the button one more time nothing happens. No another row is added. Model attributes count is still 1. I’ve been looking for solutions all over the web but couldn’t find anything that fixes my problem. How can I make form fields be added dynamically to model and displayed in vieW?

#c-sharp #asp.net