Add new element from View (PartialView) to @Model and send it to Controller

Question

I`m using ASP.NET Core 5.0 and wanna understand how to correctly add new element from View to @Model and send it to Controller

I have Request.cs (this is Model that I send to View, which contains [NotMapped] List with elements from DB)

In View I display List using PartialView using foreach loop.

foreach(var appeal in appeals)
{
     @await Html.PartialAsync("/Views/Data/Modal/Partial/_FoivAppealPartial.cshtml", appeal);     
}

Using add button I can add new PartialView with new FoivAppeals class

<button class="appealaddbutton" id="addfoivappeal"><i class="fas fa-plus"></i></button>
$("#addfoivappeal").click(function () {
    $.ajax({
        type: "POST",
        url: '@Url.Action("DisplayNewFoivApeal","Data")',
        success: function (html) { 
           $("#foivappeals").append(html);  
         }
    });
  return false;
});

This is PartialView for FoivAppeals class

@model FoivAppeals
@inject DataBaseContext db

<div class="container">
    <div class="row" >
        <div class="col-5">
            <label for="inp" class="inp">
                <input class="fields"  type="date" id="ffdt" asp-for="@Model.Datetime" name="@datename"/>
                    <span class="label">Дата</span>
                    <span class="focus-bg"></span>
            </label> 
        </div>
        <div class="col-5">                
            <label for="inp" class="inp">
                <input class="fields" asp-for="@Model.Number" placeholder="&nbsp;" required name="@numbername"/>
                <span class="label">Номер</span>
                <span class="focus-bg"></span>
            </label>  
        </div>
        <div class="col-2 appealdeletediv">
            <a style="cursor: pointer;" class="deleteFoivRow" 
             onclick="$(this).parent().parent().remove();">
                <i class="fas fa-minus-circle appealdeletebutton"></i>
            </a>
        </div>
    </div>
</div>

Using

$(this).parent().parent().remove();

I can delete unnecessary elements

After all the manipulations, I need to transfer new data that is currently displayed in View to Controller.

E.g. I get 1 FoivAppeals from DB to List

In View I add one more.

So, when I click sumbit button in form I wanna see 2 elements in List in Controller instead of 1.

And so the question is....

Is there a universal way to do this?

Request Model

public class RequestModel
{
   public int Id {get;set;}
   public string IncomeNumber {get;set;}

   [NotMapped]
   public List<AppealModel> Appeals {get;set;}
}

AppealModel

public class AppealModel
{
   public int Id {get;set;}
   public string Number {get;set;}
   public string Date {get;set;}
   public RequestModel {get;set;}
}

Answer 1

This is the answer. I don't know how it works but it works.

https://www.findandsolve.com/articles/add-more-example-razor-page-using-aspnet-core-with-code-example-step-by-step