ASP.NET MVC通过JavaScript将内容添加到列表中的Controller

Question

我的html页面中有一个ListBoxFor：

@Html.ListBoxFor(model => model.SelectedProduct, new SelectList(Model.Products, "Value", "Text"), new { @class = "form-control col-12", @id = "produtosEnvolvidos" })

并且我想允许用户通过加号（+）按钮将项目添加到该列表中

<button type="button" id="addList" class="btn ml-2">+</button>

我当前正在通过javascript将项目添加到列表中

$(document).ready(function () {
    $("#addList").click(function () {
        var x = document.getElementById("produtosEnvolvidos");
        var option = document.createElement("option");
        option.text = document.getElementById("produtotxt").value;
        x.add(option);
    })
});

，并且一旦用户提交了表单，我想在控制器中检索所有新添加的项，以便更新数据库，但是一旦检查了Model.Products列表，它始终为空，我认为是因为javascript不会正确地与asp.net对话。

型号：

[Display(Name = "Product")]
public string SelectedProduct { get; set; }
public IEnumerable<SelectListItem> Products { get; set; }

在内部创建GET：

model.Products = new SelectList(model._Products, "Product", "Text");

对此有什么解决办法吗？

我可以使用JQuery和Ajax之类的技术。