Question

我在尝试研究如何创建动态（即在运行时更改）网页时有点亏本 - 实际上不知道最好的方法是什么。情况：

我正在创建一个ASP .NET MVC3 Web应用程序，并希望创建一个页面，用户正在创建一个Tariff对象并将TariffBand个对象添加到Tariff.Bands - 一个TariffBand列表对象（下面的类defs）。每个乐队都需要：

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

用户将在/Tariff/Create视图中输入每个TariffBand的详细信息，理想情况下，我希望页面上有一个按钮（"Add another band"），该按钮将显示另一组文本框关税的乐队。

我理解如何创建上面的文本框，但我无法训练如何编辑视图文件以满足上述要求。我应该使用一些部分观点吗？或者使用javascript注入一些HTML？

我不是特别想要任何代码（尽管如果你想分享一些我会感激不尽，而是指导实现这一目标的最佳方法。我可以使用razor / c＃但是使用javascript / jQuery的n00b。

我的最后一个问题是：如何在不使用@ Html.TextboxFor（）方法的情况下将文本框等中输入的值分配给视图的模型属性？只是好奇是否有办法做到这一点。

任何帮助都非常感激，尝试谷歌这个有点疯狂！

关税

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

您可以使用非顺序指数实现此目的。

首先，在blog on Haacked

中查看有关它们的一般信息

来自博客：

...我们为每个项目提供带有.Index后缀的隐藏输入需要绑定到列表。每个隐藏输入的名称是同样，如前所述，这将给模型绑定器a 绑定到列表时要查找的索引的好集合

<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 helper来构建这些：

我知道这些助手的两个版本。你可以选择一个：

Helper by Ivan Zlatev（我更喜欢这个）
Helper by Steven Sanderson

Answer 2

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

使用一些jQuery动态地在客户端上创建DOM元素（即每个资费的多个资费频段），使用数组（即TariffBands [0] .UpperLimit等的ID），以提供添加多个资费条带的能力动态地在客户端上。当它POST时，默认绑定器会将它绑定到一个TariffBand数组（前提是你在客户端上有正确的ID）。

我通过多个文件上传来执行此操作（即UploadedDocuments [0]将是客户端名称属性，然后我可以添加具有该名称的任意数量的输入以及当时的任何索引，然后迭代POST以保存文件

Answer 3

您还可以为EditorTemplate创建TariffBand并在视图中使用它。在此SO discussion

中查看我的答案

创建一个动态页面

3 个答案: