使用按钮生成动态文本框以生成文本框的子子集

时间:2011-04-20 01:42:56

标签: c# jquery asp.net-mvc

我正在使用MVC并尝试使用jquery来执行以下操作,如果有一种更简单的方法我会很高兴听到它...

我希望让我的表单创建动态输入来生成例如可能如下所示的内容:*我不知道他们将要输入多少个subcat,也不知道有多少主要类别。

category0 <btnInsertSubCat0>
subcat0.0
subcat0.1
subcat0.2

category1 <btnInsertSubCat1>
subcat1.0 
subcat1.1 

<btbInsertNewCat>

我可以生成一个接一个地附加文本框的按钮以及旁边的按钮,但即使我使用.live属性,也无法触发子项按钮。改变了很多代码并查看了不同的教程无济于事,无花果。这会很容易吗?

jQuery(document).ready(function () {
                var procID = 0;
                var orgID = 0;

                $('.clickme').live('click', function () {
                    var newItem = $("<input type='text' name='Procedure[" + procID + "]' value='Procedure[" + procID + "] />");
                    var newLabel = $("<br /><label id='Label[" + procID + "]' >ProcedureID: [" + procID + "]</label>");
                    var newDiv = $("<div class='objective'><b>Insert Objective</b>[" + procID + "." + orgID + "]</div>");
                    $("#procedureHolder").append(newLabel);
                    $("#procedureHolder").append(newItem);
                    $("#procedureHolder").append(newDiv);
                    procID++;
                });

                $('.objective').live('click', function () {
                    var newObj = $("<input type='text' id='Objective[" + (procID - 1) + "." + orgID + "]' >ObjectiveID: [" + (procID - 1) + "." + orgID + "]</label>");
                    $("#procedureHolder").append(newObj);
                    orgID++;
                });

            });

2 个答案:

答案 0 :(得分:2)

我编辑了我的帖子,我自己想出了如何利用 jquery 创建无限数量的子动态文本框。他们都回复了表单集合。我弄清楚为什么目标没有出现,结果我宣布ID rather than Name

谢谢!

答案 1 :(得分:0)

我使用以下方法使用ASP.NET MVC进行动态搜索。在数据库中管理映射到产品的搜索选项。这使得营销团队可以在网站的管理部分调整搜索结果和搜索选项。基本上,方法如下:

    public class FormFieldCollection : List<FormField>
    {
        public string FormFieldType { get; set; }
    }

    public class FormField
    {
        public string Name {get;set;}
        public string Type {get;set;}
        public string Value {get;set;}
        public bool IsChecked {get;set;}
    }

    public class FormFieldModel
    {
        public FormFieldCollection PaymentOptions { get; set; }
    }

在自定义助手生成的视图中或使用foreach。 在您的Controller操作中,例如:

public ActionResult SomeActionMethod(FormCollection formCollection) 
{
   //search through the results, map back to class or loop through key value pairs.
}

查看代码,显然包含一些不错的html标记来格式化表单。

@Model FormFieldCollection 
@{     
      View.Title = "Form";     
      Layout = "~/Views/Shared/_defaultMaster.cshtml"; 
 }
   @foreach(var formField in Model){
      <input type="@formField.Type" id="@formField.Name" name="@formField.Name"   value=""@formField.Value"" />   
}
@using (Html.BeginForm("SomeActionMethodAdd", "ControllerName", FormMethod.Post)) 
{

   //Submit form to 
   Field Name: <input type="text" value="" />  * must be unique

   <input type="submit" value="Submit" /> 

}

语法对于剃刀来说可能并不完美。