将动态创建的表单元素与硬编码的html格式

时间:2016-05-14 05:01:16

标签: jquery

我有这个html表格

<div class="allsubjects">
<form class="profile">
<label>Names</label>
<input type="text" name="names" value="" />
<label>City</label>
<input type="text" name="city" value="" />
</form>
</div>

<button class="add">
Add
</button>

用于输入一些数据。此表单旁边是动态创建的表单字段

$(document).ready(function(){
$( ".add" ).on( "click", function() {
$( ".profile" ).append( '<div class="col-md-3"><div class="form-group"><label>Subject</label><input type="text" name="" value="" class="form-control" placeholder="First row, second input"></div></div>');

});
});

这是小提琴https://jsfiddle.net/5o52ueey/9/

有没有办法可以像往常一样发布普通表单并接收输入,并将动态发布的表单信息作为数组获取?

2 个答案:

答案 0 :(得分:0)

您可以使用AJAX尝试以下内容。使用“当前”按钮创建动态字段&amp;用于提交表单的新按钮。

<form style='float:left; padding:5px; height:0px' th:object="${p}" th:method="post"
 th:action="@{'/dashboard/testSession/'+${session.mySessionAttribute} }">
    <button class="btn btn-default btn-xs" type="submit">Test Session</button>
</form>

答案 1 :(得分:0)

我序列化了数组https://api.jquery.com/serializeArray/

'submit #er': function(event){
  event.preventDefault();
  var names = event.target.names.value;
  var examname = event.target.examname.value;
  var classname = event.target.classname.value;
  // var result = event.target.results.value;
  var formData = $('#er').serializeArray();
   console.log(formData);  
}

这适用于动态创建的表单字段。