ASP.NET MVC 3动态控件

Question

我是MVC的新手,想知道如何在MVC3中动态创建控件？在我的情况下,情况是有一个表格,候选人输入他的工作经验,他可以根据他以前工作过多少公司添加多个条目.因此,当用户说"添加另一个"时,需要动态添加用户输入详细信息的控件集.

我用谷歌搜索了一下,但是除了使用jquery创建控件之外,它没有多大区别.我的主要问题是如何动态呈现控件,然后在提交表单时获取它们的值.

如果有人能就此提出一些样本/教程,那会很棒吗？

Answer 1

你显然来自Asp.net WebForms背景,因此在比较MVC和WebForms方面存在一些问题.

通常会在客户端上添加动态控件

添加其他HTML元素只需在客户端上完成,因为它快速,方便且不需要服务器端状态保存.并且因为(几乎)不需要在服务器上加载这些.正如您可能已经发现的那样,Asp.net MVC与Asp.net WebForms完全不同.

一个易于理解的例子

因此,最简单的方法是在客户端上加载模板,然后根据该特定模板添加新项目.这个JSFiddle向您展示了如何.如果你不能在HTML中提供模板,你总是可以通过Ajax加载它,但只有在以下情况下才能加载:

1. 要添加太多不同的模板 - 一个示例是一个包含用户列表的页面,其中每个用户都需要一个复杂的模板,这可能会因为DB请求和膨胀的HTML而减慢速度
2. 模板依赖于用户已输入的其他数据,在这种情况下,我们无法在用户提供此数据之前准备模板(尽管.tmpl提供了条件和循环,因此我们应尽可能使用这些模板).

基本上我已经使用jQuery及其.tmpl()插件来快速生成具有正确命名和ID等的复杂项目(复杂的,我的意思是不包含单个HTML元素).控件名称对应于Asp.net MVC的工作方式.这些生成的字段很容易建模绑定到此控制器操作方法:

public ActionResult Experiences(Experience experience)
{
    // do what's appropriate
}

此代码中使用的相关类(仅限相关属性):

public class Experience
{
    [Required]
    public IList<Company> Companies { get; set; }
    ...
}

public class Company
{
    [Required]
    public string Name { get; set; }
    ...
}

模型绑定IList<T>是这里的想法

基本上每当你进行模型绑定时IList<T>(当你动态添加新的和新的控件时基本上就会发生这种情况),你需要在客户端上解决一些需要正确输入形式命名的问题.您可以在我的博客文章中阅读与此相关的所有详细信息,以及我解释问题并提供与此类似的解决方案.

重要:.tmpl()我没有使用jQuery链接到CDN,而是在JSFiddle示例中将其最小化版本直接复制到HTML部分,因为否则它将不会加载插件.