在一页上创建/更新一对多关系模型

如何解决在一页上创建/更新一对多关系模型

找不到在线的示例，该示例不涉及在单独的页面上为每个模型创建或更新行。我有一个简单的访问表，其中总体访问是一个模型，其中包含主机的信息和其他通用参数。第二种模型是“访客”，其中“访客”可以有很多。关系很好，我可以分别更新它们。

我已经建立了一个请求表单，我想在一页上做所有事情。表单的上半部分是有关访问的常规信息，下半部分是javascript动态表单部分，用于动态添加/删除访问者。表单的效果很好，可以很好地输入“访问”信息，但是我不能从进入的信息中获取列表。它们的名称遵循“访问者[1]。名称”等格式。

我尝试将List Visitors作为一个变量添加到Visit模型中，还尝试了一个组合的自定义模型，其中包含Visit和Visitors。有人有建议吗？

解决方法

根据您的描述，我想这个问题可能与输入的名称值有关。由于模型绑定将根据参数名称绑定值。我建议您可以检查输入名称，以确保它与模型绑定格式匹配。

例如：

如果您的访问和访问者类别如下： 公开课参观 { public int id {get;组; } 公共字符串visitname {get;组; } 公开名单访问者{组; } } 公共类访客 { public int id {get;组; } 公共字符串访问者组; } }

然后，访客的输入名称应为visitors[0].id，visitors[1].id，visitors[2].id，visitors[0].visitor，visitors[1].visitor或其他。

更多详细信息，您可以参考以下代码：

控制器：

public class HomeController : Controller
    {
        Visit visits;//It is a global variable
        public HomeController()
        {
            visits = new Visit
            {
                id = 10,visitname = "visit1",visitors = new List<Visitors>
                {
                    new Visitors{ id=19,visitor="visitor1"},new Visitors{ id=20,visitor="visitor2"}
                }
            };
        }

        public IActionResult Index()
        {
            return View(visits);
        }
}

在Index.cshtml中，JavaScript对视图所做的更改可能会影响Visitors 1。Name中下标的更改。因此，在添加元素和删除相应元素时，应该更改索引值。

    @model solution930.Models.Visit
@{
   //Set a global variable
    var count = Model.visitors.Count;
}
    <form action="/home/get" method="post">
        id
        <input asp-for="@Model.id" />
        visitname
        <input asp-for="@Model.visitname" />
        <div id="visitors">
            @for (var i = 0; i <count; i++)
            {
                <div class="visitor">
                    <input name="visitors[@i].id" asp-for="@Model.visitors[i].id" />
                    <input name="visitors[@i].visitor" asp-for="@Model.visitors[i].visitor" />
                    <input type="button" name="name" value="deleterow" onclick="del(event,@Model.visitors[i].id)" />
                </div>
            }
        </div>
        <input type="submit" name="name" value="sub" />
    </form>
<button id="addvisit" onclick="add()">add</button>
@section Scripts{
    <script>
        var hasCount=@count;
        function del(e,id) {
            if (index == 0) {
                console.log(e.currentTarget.parentElement)
                e.currentTarget.parentElement.remove()
                return;
            }
            location.href = '/home/delete?id=' + id
       }

        function add() {
            var ele = '<div class="visitor"> <input name="visitors[' + hasCount + '].id" type="number" data-val="true" data-val-required="The id field is required." id="visitors_' + hasCount + '__id" value="">  <input name = "visitors[' + hasCount + '].visitor" type = "text" id = "visitors_' + hasCount + '__visitor" value = "" >  <input type="button" name="name" value="deleterow" onclick="del(event,0)"> </div>'
            $('#visitors').last().parent().append(ele)
            hasCount++
            console.log(hasCount)
        }
    </script>
}

结果：