创建动态页面

Question

我有点不知所措，试图找出如何创建一个动态的(即在运行时改变)网页-字面上不知道什么是最好的方法。情况：

我正在创建一个ASP .NET MVC3 web应用程序，并希望创建一个页面，其中用户正在创建一个Tariff对象，并将TariffBand对象添加到Tariff.Bands --一个TariffBand对象的列表(下面是类防御)。每个乐队要求：

• 下限的文本框
• 上限的文本框
• 单位费率的文本框

用户将在TariffBand视图中输入每个/Tariff/Create的详细信息，理想情况下，我希望页面上有一个按钮("Add another band")，该按钮将显示另一组textboxes，用于下一个带宽。

我理解如何创建上面的文本框，但我无法解决如何编辑视图文件以满足上面的要求。我应该用一些局部的观点吗？还是用javascript注入一些HTML？

我并不是特别寻找任何代码(虽然如果您想要分享一些代码，我会很感激，而是指导如何最好地实现这一点。我可以使用剃须刀/c#，但是n00b可以使用javascript/jQuery。

我的最后一个问题是:在不使用@Html.TextboxFor()方法的情况下，如何将textboxes等中输入的值赋给视图的模型属性？只是好奇是否有办法做到这一点。

任何帮助真的很感激，有点疯狂尝试谷歌这一个！

关税

class Tariff
{
    public int id {get; set;}
    public List<TariffBand> Bands {get; set}
}

关税等级

class TariffBands
{
    public int Id {get; set;}
    public int UpperLimit  {get; set;}
    public int LowerLimit  {get; set;}
}

非常感谢，大卫

Answer 1

您可以使用非顺序索引来实现这一点。

首先，请参阅哈克德博客中有关它们的一般信息。

来自博客：

...we为我们需要绑定到列表的每一项提供一个带有.Index后缀的隐藏输入。这些隐藏输入的名称都是相同的，因此如前所述，这将使模型绑定器在绑定到列表时可以找到一组很好的索引。

<form method="post" action="/Home/Create">

    <input type="hidden" name="products.Index" value="cold" />
    <input type="text" name="products[cold].Name" value="Beer" />
    <input type="text" name="products[cold].Price" value="7.32" />

    <input type="hidden" name="products.Index" value="123" />
    <input type="text" name="products[123].Name" value="Chips" />
    <input type="text" name="products[123].Price" value="2.23" />

    <input type="hidden" name="products.Index" value="caliente" />
    <input type="text" name="products[caliente].Name" value="Salsa" />
    <input type="text" name="products[caliente].Price" value="1.23" />

    <input type="submit" />
</form>

然后，一旦您了解了该技术的原理，就有可能使用html助手来构建以下内容：

我知道有两种版本的这种帮手。这取决于你选择一个：

1. Ivan Zlatev的助手 (我更喜欢这个)
2. 史蒂文·桑德森的助手

Answer 2

我不会提供所有的代码，但是做模型会有所帮助。

使用一些jQuery来动态地创建客户端上的DOM元素(即每个关税的多个关税范围)和数组(例如，id of TariffBands.UpperLimit，等等)。提供在客户上动态添加多个关税等级的能力。当它发布时，默认绑定器将将其绑定到TariffBands数组(前提是您在客户端上具有正确的ID)。

我使用多个文件上传(即UploadedDocuments将是客户端名称属性)，然后我可以使用该名称添加尽可能多的输入，并使用它当时的任何索引，然后在POST上迭代以保存文件。

Answer 3

您还可以为EditorTemplate创建一个TariffBand并在视图中使用它。在这个所以讨论中检查我的答案