动态添加项目到集合

我有一个视图，添加元素到集合：它给我添加了html元素，但是当我调用ActionResult时，Model.TagModelsis仍然是空的（开始时是空的）。动态添加项目到集合

<div id="tags_div"> 
      <label id="add_tag">Hello</label> 
      @foreach (var item in Model.TagModels) 
      { 

       <div class="editor-field"> 
        @Html.EditorFor(model => item.Name) 
        @Html.ValidationMessageFor(model => item.Name) 
       </div> 

      }</div> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       var $newdiv1 = $('<div class="ui-button-text"><input class="text-box single-line" id="item_Name" name="item.Name" type="text" value="b" /><span class="field-validation-valid" data-valmsg-for="item.Name" data-valmsg-replace="true"></span></div>'); 
       $("#add_tag").live("click", function() { 
        $(this).append($newdiv1); 
        return false; 
       }); 
      }); 
     </script>

这里是我的视图模型：

public class QuestionTagViewModel 
    { 
     public QuestionModel QuestionModel { get; set; } 

     //private List<TagModel> _tagModels=new List<TagModel>(){new TagModel(){Name = "a"},new TagModel(){Name = "b"}}; 
     private List<TagModel> _tagModels = new List<TagModel>(); 

     public List<TagModel> TagModels 
     { 
      get { return _tagModels; } 
      set { _tagModels = value; } 
     } 
    }

为什么没有对模型没有更新？当我改变别人属性静态元素一切正常

编辑要MHollis：

安东感谢您的回复:)

现在我有

<script type="text/javascript"> 
      $(document).ready(function() { 
       $("#addItem").click(function() { 
        $.ajax({ 
         url: this.href, 
         cache: false, 
         success: function (html) { $("#tags_div").append(html); } 
        }); 
        return false; 
       }); 
      }); 
     </script>

而且tags_div ：

<div id="tags_div"> 
      <label id="add_tag">Hello</label> 
      @Html.ActionLink("Add another...", "BlankEditorRow", null, new { id = "addItem" }) 

      @foreach (var item in Model.TagModels) 
      { 

       <div class="editor-field"> 
        @Html.EditorFor(model => item.Name) 
       </div> 

      }</div>

而且该PartialViewResult方法：

public PartialViewResult BlankEditorRow() 
     { 
      var x=PartialView("TagRow", new TagModel()); 
      return x; 
     }

和局部视图：

@*@using Szamam.Models 
@model TagModel 

<div class="editor-field"> 
    @Html.EditorFor(model => model.Name) 
    @Html.ValidationMessageFor(model => model.Name) 
</div>*@ 


<div class="editor-field"> 
<input class="text-box single-line" id="[0].Name" name="[0].Name" type="text" value="b" /> 
</div>

元素被添加，但是当外商投资企业的ActionResult，集合为空：/

所以应该有另外一个原因：/

来源

2011-07-02 user278618

这是因为您通过javascript添加的输入具有“item_name”的id和“item.n的名称火焰”。他们需要具有“TagModels [0] .Name”，“TagModels [1] .Name”，“TagModel [2] .Name”的名称。注：这是怎么回事关信息发现here

UPDATE

好了，我继续花时间做给你提供的数据，这项工作。谢天谢地，我需要类似于我正在处理的项目的类似事情，不幸的是我的项目在VB.Net中，但为了帮助您，我在C＃中完成了这些代码（显然）。注意：除了缺少使用语句之外，您可以将此代码复制并粘贴到干净的项目中。

查看

@model MvcApplication1.Models.QuestionTagViewModel 
@{ 
    Layout = null; 
} 
<!DOCTYPE html> 
<html> 
<head> 
    <script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery.validate.js" type="text/javascript"></script> 
    <script src="../../Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      var re = /\[(.*?)\]/ ; 
      $("#add_tag").click(function() { 
       var name = $(".tagRows:last>input").attr("name"); 
       var m = re.exec(name); 
       var itemNumber = parseInt(m[1]) + 1; 
       var $newdiv1 = $('<div class="tagRows"><input class="text-box single-line" id="TagModels' + itemNumber + '__Name" name="TagModels[' + itemNumber + '].Name" type="text"><span class="field-validation-valid" data-valmsg-for="TagModels[' + itemNumber + '].Name" data-valmsg-replace="true"></span></div>'); 
       $(".tagRows:last").after($newdiv1); 
       return false; 
      }); 
     }); 
    </script> 
    <title>TagsTest</title> 
</head> 
<body> 
    @using (Html.BeginForm()) 
    { 
     <div id="tags_div"> 
      <label id="add_tag"> 
       Hello</label> 
      @for (int i = 0; i < Model.TagModels.Count; i++) 
      { 
       <div class="tagRows"> 
        @Html.EditorFor(model => model.TagModels[i].Name) 
        @Html.ValidationMessageFor(model => model.TagModels[i].Name) 
       </div> 
      } 
     </div> 
     <input type="submit" name="submit" value="Submit" /> 
    } 
</body> 
</html>

型号

namespace MvcApplication1.Models 
{ 
    public class QuestionTagViewModel 
    { 

     //private List<TagModel> _tagModels=new List<TagModel>(){new TagModel(){Name = "a"},new TagModel(){Name = "b"}}; 
     private List<TagModel> _tagModels = new List<TagModel>(); 

     public List<TagModel> TagModels 
     { 
      get { return _tagModels; } 
      set { _tagModels = value; } 
     } 
    } 

    public class TagModel 
    { 
     public string Name { get; set; } 
    } 
}

控制器

namespace MvcApplication1.Controllers 
{ 
    public class HomeController : Controller 
    { 

     public ActionResult TagsTest() 
     { 
      var tagmodels = new List<TagModel>(); 
      tagmodels.Add(new TagModel() { Name = "Tag1" }); 
      tagmodels.Add(new TagModel() { Name = "Tag2" }); 
      tagmodels.Add(new TagModel() { Name = "Tag3" }); 
      var model = new QuestionTagViewModel() { TagModels = tagmodels }; 


      return View(model); 
     } 

     [HttpPost] 
     public ActionResult TagsTest(QuestionTagViewModel model) 
     { 
      return null; 
     } 
    } 
}

来源

2011-07-02 19:47:49 MHollis

，我不能同意你的看法。如果我的收藏在开始时有10个元素，那么他们都有ID“item_name”和名称“item.name” – user278618

我想引导你到这篇博客文章。 http://weblogs.asp.net/nmarun/archive/2010/03/13/asp-net-mvc-2-model-binding-for-a-collection.aspx – MHollis

伟大的MHollis！明天我会开始赏金，我会给你它:)有一个“错误”。当我第二次点击标签“Hello”时，我失去了添加元素：/期望的效果是添加下一个元素。您能纠正它吗？ :) – user278618

动态添加项目到集合

回答

相关问题