ASP.NET MVC 4如何向包含dropdownlist的表中添加行

Question

我有一张小桌子作为表格的一部分。 它在下拉列表旁边显示一个数字，允许用户选择一个值以与该数字一起使用。 我想允许用户使用添加行到此表，并能够分配所需的任意多个值。 我整天都在搜索Google，并尝试了很多方法，但似乎没有什么适合我的情况。 实现此功能的最佳方法是什么？

这是我的视图中包含表和添加操作链接的代码：

 <div class="form-group">
     @Html.LabelFor(m=>m.Part.PartConnectionTypes, new {@class = "control-label col-md-5"})
         <div class="col-md-7">
             <table class="table table-condensed table-striped table-bordered">
                 <thead>
                     <tr>
                         <td>Number</td>
                         <td>Value</td>
                     </tr>
                 </thead>
                 <tbody>
                     @{
                         for(var i = 0; i < Model.Part.PartConnectionTypes.Count; i++)
                         {
                             var count = i + 1;
                             <tr>
                                 <td>@count</td>
                                 <td>@Html.DropDownListFor(m => m.Part.PartConnectionTypes[i].ConnectionType, new SelectList(Model.ConnectsTo, "CodeId", "ValChar"), "", new { @class = "form-control" })</td>
                             </tr>
                          }
                      }
                  </tbody>
              </table>
              @Html.ActionLink("Add Connection", "AddNewPartConnection", "Home", new { id = "addConnection"})
          </div>

这是动作链接的控制器方法：

public ActionResult AddNewPartConnection(IndexViewModel model)
    {
        var newPartConnectionType = new PartConnectionType();

        model.Part.PartConnectionTypes.Add(newPartConnectionType);

        return View("Index", model);
    }

和索引方法：

public ActionResult Index(string searchString)
    {
        var model = new IndexViewModel { Part = new Part() };
        model.Part.PartConnectionTypes.Add(new PartConnectionType());
        if (!String.IsNullOrEmpty(searchString))
        {
            model.Part = CoreLogic.GetPartByPartCode(searchString);
            if (model.Part == null)
            {
                model.Part = new Part();
                model.Part.PartConnectionTypes.Add(new PartConnectionType());
                ViewBag.SearchMessage = "That is not a current part";
            }
        }
        return View(model);
    }

感谢任何人可以提供的任何帮助。

Answer 1

我只是将“表行”的视图分离为“部分视图”，并在添加按钮单击事件时呈现该视图。

两个是您可以实现的目标，

1）使用jquery，调用ajax并让mvc向您返回html，然后将其放置在表中“最后一行”之后2）使用mvc ajax表单并告诉其操作-在结束并将其作为ID替换为成功的html。

希望这可以帮助。