在表单asp.net mvc5中添加/更新/删除列表中的元素

时间:2015-03-02 22:55:13

标签: c# jquery asp.net asp.net-mvc-5 asp.net-ajax

我使用ASP.NET MVC 5。 我正在尝试(没有成功:|)创建一个表单,这个表单的一个参数是一个列表。我在如何添加/删除/更新此列表的元素方面遇到了麻烦。 我尝试了很多不同的样本(使用ajax,kendo ui等)并没有成功。

简化问题:

我希望能够在数据库中添加House信息。 每个房子都有信息和居住者名单

详细说明: - 我的住户没有保存在任何地方。所以无法访问数据库或其他 - 在按下“创建房屋”按钮之前没有创建任何内容。在此页面中保留/创建的所有内容 - 解决方案甚至可以使用kendo ui - 我正在寻找一个非常简单的解决方案:)

非常感谢!

public class House
{
    [Key]
    public int HouseID { get; set; }

    public string Address { get; set; }
    public int RoomsCount;

    public List<Occupant> OccupantsList { get; set; }
}

public class Occupant
{
    public string Name { get; set; }
    public int Age { get; set; }
}

创建住宅页面

@model DeveloperConsole.Models.House

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Houses</title>
</head>
<body>
    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken()
        @RenderBody()

        <div class="form-horizontal">
            <h4>House</h4>
            <hr />
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            <dl class="dl-horizontal">
                <dt class="form-group">
                    @Html.LabelFor(model => model.Address)
                </dt>

                <dd class="col-md-10">
                    @Html.EditorFor(model => model.Address)
                </dd>

                <dt class="form-group">
                    @Html.LabelFor(model => model.RoomsCount)
                </dt>

                <dd class="col-md-10">
                    @Html.EditorFor(model => model.RoomsCount)
                </dd>

                <dd class="form-group">
                    @if (Model.OccupantsList.Count > 0)
                    {
                        <table class="table">
                            <tr>
                                <th>
                                    @Html.DisplayNameFor(model => model.OccupantsList[0].Name)
                                </th>
                                <th>
                                    @Html.DisplayNameFor(model => model.OccupantsList[0].Age)
                                </th>
                            </tr>

                            @foreach (var template in Model.OccupantsList)
                            {
                                Html.RenderPartial("Occupant", template);
                            }

                        </table>
                    }

                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10">
                            <input type="button" value="Add an Occupant" class="btn btn-default" />
                        </div>
                    </div>
                </dd>
                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <input type="submit" name="command" value="Create House" class="btn btn-default" />
                    </div>
                </div>
        </div>
    }
    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>

</body>

</html>

乘员部分视图

@model DeveloperConsole.Models.Occupant

<div class="editorRow">
    <tr>
        <td>
            @Html.EditorFor(model => model.Name)
        </td>

        <td>
            @Html.EditorFor(model => model.Age)
        </td>

        <td>
            <div class="col-md-offset-2 col-md-10">
                &lt;input type="button" value="Delete this Occupant" class="btn btn-default" />
            </div>
        </td>
    </tr>
</div>

0 个答案:

没有答案