ASP.NET MVC & JQuery 动态表单内容

Posted 2023-04-13

【中文标题】ASP.NET MVC & JQuery 动态表单内容

【英文标题】：ASP.NET MVC & JQuery Dynamic Form Content

【发布时间】：2010-10-02 14:16:32

【问题描述】：

我想使用 JQuery 向 ASP.NET MVC 表单动态添加字段。

例子：

<script language="javascript" type="text/javascript">
    var widgets;

    $(document).ready(function() 
        widgets = 0;
        AddWidget();
    );

    function AddWidget() 
        $('#widgets').append("<li><input type='text' name='widget" + widgets + "'/></li>");
        widgets++;
    
</script>

<ul id="widgets">
</ul>

这可行，但我打算手动迭代控制器中的表单值：

[AcceptVerbs("Post")]
public ActionResult AddWidget(FormCollection form)

    foreach (string s in form)
    
        string t = form[s];
    

    return RedirectToAction("ActionName");

但是当我将用户发送回控制器中的 Get Action 时，我想到了，我必须使用输入的值设置 FormData，然后使用

在当前版本中执行此操作的最佳方法是什么（我相信是 5 个）？

【参考方案1】：

我的解决方案可能是这样的（伪代码）：

<script language="javascript" type="text/javascript">
    var widgets;

    $(document).ready(function() 
        widgets = 0;
        <% for each value in ViewData("WidgetValues") %>
             AddWidget(<%= value %>);
        <% next %>
    );

    function AddWidget( value ) 
        $('#widgets').append("<li><input type='text' name='widget" + widgets + 
                             "'>" + value + "</input></li>");
        widgets++;
    
</script>

<ul id="widgets">
</ul>

在控制器中：

[AcceptVerbs("Post")]
public ActionResult AddWidget(FormCollection form)

    dim collValues as new Collection;
    foreach (string s in form)
    
        string t = form[s];
        collValues.add( t )
    
    ViewData("WidgetValues") = collValues;
    return RedirectToAction("ActionName");

您可以稍后制定详细信息 （很抱歉将 VB 与 C# 混为一谈，我是 VB 人）

【参考方案2】：

我可能在这里忽略了这一点，但是，您是否需要通过表单操作将数据实际发布回控制器？为什么不使用 jquery 进行 ajax 调用以将数据发布到控制器……或者更好的是 Web 服务？异步发送数据，无需使用传入的数据值重建视图。

如果这些值正在被使用并且不再使用，这很好用，但是，如果您计划保留数据并通过视图显示它，您的模型应该真正支持数据结构。可能是模型上的Dictionary<string, string>。

【讨论】：

回首往事，我很确定我在这里无意中混淆了***.com/questions/716395/… 的部分答案。这些 cmets 没什么可看的，继续前进！

【参考方案3】：

我不是 ASP.net 开发人员，但我从 php 知道您可以使用数组作为输入字段的名称

例如：

<input type="text" name="widgets[]" />
<input type="text" name="widgets[]" />

然后，您可以遍历 post 变量小部件，就好像它是一个值数组一样。

不要乱用动态命名的变量等。

【参考方案4】：

据我了解，问题是在小部件中保留发布的值。 我认为您可以在视图渲染期间渲染那些您不会在服务器上填充的最宽的部分。