c# - 将无序列表中的数据与 C# 中的 POCO 一起或与 POCO 一起发回 Controller 操作

Question

我正在使用 FuelUX 创建一个 Pillbox，以便用户可以使用 javascript 添加关键字。 Javascript 从文本框中获取数据并将其添加到无序列表中。 除了这些关键字外，我还想添加一些我包装到 POCO 中并希望发布到服务器的字段。 现在显然我想将这些关键字与我的 POCO 一起发布，或者也将这些关键字包装到我的 POCO 中，在本例中为 DummyClass。

谁能告诉我怎么做？

这是我想要通过关键字和标题实现的目标的直观表示。

我的 Controller 代码:

public ActionResult Create()
{
    return View();
}

[HttpPost]
public ActionResult Create(DummyClass obj)
{
   // PROCESS OBJECT & LIST OF DATA OUT OF MY <UL>-control
}

我的查看代码:

@using System.Web.Optimization

@model Test.DummyClass

@{
    ViewBag.Title = "Index";
}

@section content
{
    <div class="editor-label">
        @Html.LabelFor(model => model.Title)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Title)
        @Html.ValidationMessageFor(model => model.Title)
    </div>

    <div id="MyPillbox" class="pillbox">
        <ul>
            <li data-value="foo">Item One</li>
            <li class="status-success">Item Two</li>
            <li class="status-warning">Item Three</li>
            <li class="status-important">Item Four</li>
            <li class="status-info">Item Five</li>
            <li class="status-success">Item Six</li>
            <li>Item Seven</li>
        </ul>
    </div>

    <input type="text" id="newTag" value="test"/>
    <input type="button" value="Add" id="btnAddTag"/>    

    <input type="submit"/>
}

@section scripts
{
    @Styles.Render("~/Scripts/fuelUX")

    <script>
        $(function() {

            $('#btnAddTag').click(function () {
                $('#MyPillbox ul').append('<li class="status-info">' + $('#newTag').val() + '</li>');
            });

        });
    </script>

Answer 1

如果您可以为每个药丸添加一个隐藏的 HTML 字段，您可能就可以开始了:

    $(function() {
        $('#btnAddTag').click(function () {
            $('#MyPillbox ul').append('<li class="status-info">' + $('#newTag').val() + '<input type="hidden" name="Tags" value="' + $('#newTag').val() + '" /></li>');
        });
    });

在 Controller 中，您可以将此模型用于您的操作方法:

public class SomeModel {
    public string Title { get; set; }
    public string[] Tags { get; set; }
}