动态添加更多文本字段 MVC 视图答案

【问题标题】：Add more text fields dynamically MVC View动态添加更多文本字段 MVC 视图
【发布时间】：2014-05-12 16:45:14
【问题描述】：

我正在尝试执行here 发布的内容，但在我的情况下，我不得不对其进行一些修改，因为 MVC 视图在呈现时具有多个表单标签。我需要可以与现有文件输入同名的“文件”框。我可能还需要为每个新盒子添加新名称和描述，但还没有做到这一点。

我的观点：

<div id="dialog1" title="Upload Multiple Files">
<% using (Html.BeginForm("MyAction", "MyController", new { path = Model.FullPath }, FormMethod.Post, new { enctype = "multipart/form-data", id = "uploadsfrm" }))
   {%>
<p>
    <input type="file" id="file1" name="fileUpload" size="23" />
</p>   
<p>
    Title</p>
<input type="text" id="Text1" name="txtNiceName" style="width: 100%;"/>
<p>
    Description</p>
<input type="text" id="Text2" name="txtDescription" style="width: 100%;"/>

<INPUT type="button" value="Add" onclick="addbox('file')"/>
<span id="addBoxes">&nbsp;</span>
<p>
    <input type="submit" value="Upload file" /></p>  
  <% } %>
 </div>

脚本：

 function addbox(type) {

    var element = $("#uploadsfrm").createElement("input");
    element.setAttribute("type", type);
    element.setAttribute("value", type);
    element.setAttribute("name", type);

    var foo = $("#uploadsfrm").getElementById("addBoxes");

    foo.appendChild(element);

}

当我单击添加按钮时，我在 Firebug 中遇到的错误是： “TypeError: $(...).createElement 不是函数”

谁能解释一下？提前致谢。

【问题讨论】：

标签： javascript jquery asp.net-mvc forms

【解决方案1】：

您正在使用jQuery。

jQuery 不包含.createElement() 函数。这就是您收到此错误的原因。

如果你想用 jQuery 创建一个新元素，你只需要执行$ 函数，并带有一个元素标签作为参数。

var element = $("<input>")`//in this example, we create a new input.

如果您想将此元素附加到另一个元素，您只需执行.append() 函数，例如：

$("#uploadsfrm").append(elememt);

您还可以使用$ 函数定义您的属性。

例子：

function create(){
   //new Input stored in element
   var element = $("<input>",{
       //your Attributes
       name:"theInputName",
       placeholder: "yourPlaceholder"       
   });
   //appending your New input
   $("#yourAppendID").append(element);
}

【讨论】：