Question

我正在创建一个表单以将数据放入数据库中。现在我想使用一个数组，因为我想在表单中放一个表单。例如，您有一个表单，用户可以在其中放置有关自己的信息，例如年龄名称等。一个问题是关于他的朋友，你必须填写所有朋友的姓名和年龄。因为你有一个以上的朋友，你可以添加多个朋友。所以你填写一个朋友的姓名和年龄，点击保存，然后你可以继续填写另一个朋友的信息。单击“保存”时，不保存整个表单。

我希望我能很好地解释它。

这是我的表格：

public class User
{
    [BsonElement("Id")]
    public int Id { get; set; }

    [BsonElement("Email")]
    public string Email { get; set; }

    [BsonElement("Name")]
    public string Name{ get; set; }

    [BsonElement("Company")]
    public string Company { get; set; }

    [BsonElement("Array friends")]

}

查看：

@model ISPInvoice.Models.Invoice
@using (Html.BeginForm("Edit", "Home"))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>New Note</legend>
        <h3>New Note</h3>
        <div class="editor-label">
            @Html.LabelFor(model => model.InvoiceNumber)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.InvoiceNumber)
        </div>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

Answer 1

添加另一个名为Friend的课程

public class Friend
{

[BsonElement("Name")]
public string Name { get; set; }

[BsonElement("Age")]
public int Age{ get; set; }    

}

在您的User类中添加一个好友列表。

public class User
{

[BsonElement("Id")]
public int Id { get; set; }

[BsonElement("Email")]
public string Email { get; set; }

[BsonElement("Name")]
public string Name{ get; set; }

[BsonElement("Company")]
public string Company { get; set; }

[BsonElement("Array friends")]
public List<Friend> Friends { get;set;}
}

要访问View中的Friends列表，您可以遍历列表。

@foreach (namespace.Models.Friend friend in Model.Friends)
{
    @Html.LabelFor(item => friend.Name)
}

Answer 2

听起来你需要一些客户端代码。

根据我的理解，您可能会做的事情是在您与所选朋友更新的表单中隐藏输入。

问题在于标准表单编码不支持分层数据，因此您需要手动添加对该数据的支持。这不是太难，正如你所看到的那样，但这很麻烦。如果您使用像Angular这样的框架，或者甚至只是使用AJAX进行发布，这将非常容易。但这是一个相当大的变化，可能不值得通过并仅针对这种情况实施。

此示例依赖于jQuery。它也非常简单，并且不支持删除或编辑现有朋友等任何内容。不过，你应该可以很容易地添加这些东西。它也绝对没有任何验证，所以请按照你的方式。

＆＃13;

var friends = [];

function refreshHiddenField() {
  $("#friendsListText").val(friends.map(function(d) { return d.name + "=" + d.age }).join(";"));
}

document.addEventListener("DOMContentLoaded", function(event) { 
$("#btnAddFriend").click(function() {
  var name = $("#newFriendName").val();
  var age = $("#newFriendAge").val();
  
  friends.push({ name : name, age: age });
  refreshHiddenField();

  var li = $("<li />").text(name + " (" + age + ")");

  $("#friendsList").append(li);
});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<!-- This will actually be an @Html.HiddenFor(m => m.FriendsText), or something -->
<input type="text" id="friendsListText" readonly placeholder="Add some friends first" />

<hr />

<input type="text" id="newFriendName" placeholder="Name" />
<input type="number" id="newFriendAge" placeholder="Age" />

<button type="button" id="btnAddFriend">Add!</button>

<br />

<ul id="friendsList">
</ul>

＆＃13;

当您发现使用该示例（尽管测试非常轻微）时，添加好友会将详细信息附加到用户可见列表，并将机器可读格式附加到输入中。根据评论，此输入在此示例中可见，以查看发生了什么，但它不会在生产中。

一旦您完成了客户端代码，您只需在保存时解析隐藏字段。假设Friend类包含string Name和int Age的属性，

[HttpPost]
public ActionResult EditProfile(User m)
{
    // Unrelated stuff

    var friends = m.FriendsText.Split(';').Select(c => {
        var args = c.Split('=');

        return new Friend { Name = args[0], Age = int.Parse(args[1]) };
    })

    // Use the collection
    // Unrelated stuff
}

这只是一些非常简单的字符串操作，使用LINQ和Split函数来理解客户端的机器可读格式。

请注意，此实现名称中不能包含分号或等号。

一旦你完成了所有工作，打印就很容易了。只是，是的，在模型中添加一个集合类型，然后循环使用foreach循环。

<ul>
    @foreach (var f in Model.FriendsCollection)
    {
        <li>@f.Name (@f.Age)</li>
    }
</ul>

我知道这不是你所说的，但我提供的只是作为一个例子，说明如何根据原始问题在模型中加入一个集合。

在我的模型中定义一个数组

2 个答案: