Question

我有一个非常简单的数据输入表格来实现。它看起来像这样：

alt text http://i40.tinypic.com/2a9pojq.gif

显然我已经嘲笑了实际的要求，但实质是相似的。

输入姓名并点击历史记录会弹出一个指向网址'/ student / viewhistory / {name}'
姓名和年龄是必填字段
带有Class（下拉列表，包含数字1 - > 10）和Subject（包含A - ＆gt; D，例如）的子表单（在模型中）形成一对唯一值，其中得分为需要。因此，选择课程和主题，输入分数并单击添加应该为学生“添加”此记录。然后，用户应该能够单击“保存”（以将条目保留到数据库中），或者能够将更多（类，主题，分数）对添加到条目中。

任何想法如何巧妙地实现这一点？（我来自DWH领域......所以以无国籍的方式思考对我来说有点陌生。）任何帮助都表示赞赏。

我认为聪明地使用jQuery会提供一个简单的解决方案。

此致卡兰

Answer 1

好的，在这种情况下，我会告诉你我是如何在几个机会上做到的：首先，我在jquery中放置一个div，其中包含空字段：

$("#add").click(function() {
    $("#classes").append($(
    "<div>" 
    +"   <select name='Student.Classes[0].Class'>"
    +"     <option value='1'>Class 1</option>"
            ....
    +"  </select>"
    +"   <select name='Student.Classes[0].Subject'>"
    +"     <option value='1'>Subject 1</option>"
            ....
    +"  </select>"
    +"  <input name='Student.Classes[0].Score' value='0'/>"
    +"</div>"
    )
);});

当点击id为#add的内容时，此div将添加到类列表中。

接下来我在提交之前捕获表单，并为每个实体（在这种情况下为Student.Classes）提供从0开始的索引。像这样：

 $("form").submit(function () {
        $("div", "#classes").each(function (i) {
            $(":input, :hidden", this).each(function () {
                $(this).attr("name", $(this).attr("name").replace(/\[0\]/, "[" + i + "]"));
            });
        });
    });

如果您正在使用支持子实体的ModelBinder，那么最终应该在服务器上包含Student中的Classes列表。当然，您可以使用firebug来查看发布到服务器的确切内容。

希望这会给出一些指导。

Answer 2

这可能有点矫枉过正，但您最有可能从学习应用程序基础和脚手架中获益。我会从http://sharparchitecture.net/开始。一旦你设置了基本的应用程序，你可以使用jquery和插件，如

jquery表格
jquery验证

处理表单直到提交。有一些插件可以帮助弹出窗口。

如何提交任意数量的子实体（例如您示例中的学生的类）实际上是您的特定服务器端实现的问题。这可以通过s＃arp架构非常优雅地完成，但在提交之前需要对表单进行一些调整。

欢迎来到无表情的网络表单世界！还有祝你好运，大卫

在ASP.NET MVC 2中实现以下条目表单的想法

2 个答案: