form表单提交 list对象给Java 后台结合-CSDN博客

<div class="form-group" style="display: none;">

<label class="col-sm-1 control-label " >员工计划id</label>
<div class="col-sm-8">
<input type="text" name="pscoreVoc[${planeeMy.num}].eeplanid"
class="form-field col-xs-10 col-sm-4"
value="${planeeMy.hepplaneePo.id}"
/>
</div>
<label class="col-sm-1 control-label " >员工计划类别</label>
<div class="col-sm-8">
<input type="text" name="pscoreVoc[${planeeMy.num}].type"
class="form-field col-xs-10 col-sm-4"
value="${planeeMy.hepplaneePo.type}"
/>
</div>
</div>

上面是结合了 freemker 的，如果是 jsp也是类似的。可以通过后端传过来的数据控制，元素的命名

同理如果是动态新增提交的话，可以动态生成input

$(".form_list_ul").each(function(i){
var mat = $(this).find('[name="mat"]').val();
var peDetails_inciseWay = $(this).find('[name="peDetails_inciseWay"]').val();
var num = $(this).find('[name="Number_id"]').val();
var requi = $(this).find('[name="peDetails_explain"]').val();
var thickness = $(this).find("input[name='peDetails_thickness0']").val();
var width = $(this).find("input[name='peDetails_width0']").val();
var length = $(this).find("input[name='peDetails_length0']").val();
var consultWeight = $(this).find("input[name='Reference']").val();
var modelNo = $(this).find("input[name='modelNo']").val();
if (mat != "" && thickness != "" && width != "" && length != "") {
var peDetails_spec_type = parseInt($(this).find('[name="type1"]').val());
var dataItem = {
"id": $(this).find("input[name='peDetails_id']").val(),
"inciseWay": peDetails_inciseWay,//切割方式
"texture" : mat,//材质
"num": num,//件数
"specType": peDetails_spec_type,//类型
"thickness": thickness,
"width": width,
"length": length,
"explain":$(this).find("textarea[name='peDetails_explain']").val(),
"consultWeight":consultWeight,//参考重量
"modelNo":modelNo//模号
};
$("#enquiry_details").append(createEnquiryDetailHidden(dataItem, i));
}
});

function createEnquiryDetailHidden(item, i){
var hiddenHtml = [];
var nameStart = "peDetails["+count+"].";
hiddenHtml.push(createHiddenField(nameStart+"id", item.id));
hiddenHtml.push(createHiddenField(nameStart+"texture", item.texture));
hiddenHtml.push(createHiddenField(nameStart+"inciseWay", item.inciseWay));
hiddenHtml.push(createHiddenField(nameStart+"num", item.num));
hiddenHtml.push(createHiddenField(nameStart+"specType", item.specType));
if(item.specType == 1 || item.specType == 2 || item.specType == 5 || item.specType == 6){
hiddenHtml.push(createHiddenField(nameStart+"thickness", item.thickness));
hiddenHtml.push(createHiddenField(nameStart+"width", item.width));
hiddenHtml.push(createHiddenField(nameStart+"length", item.length));
}
hiddenHtml.push(createHiddenField(nameStart+"explain", item.explain));
hiddenHtml.push(createHiddenField(nameStart+"modelNo", item.modelNo));
count+=1;
return hiddenHtml.join("");
}

/**
* 一个Hidden
* @param name
* @param value
* @returns {String}
*/
function createHiddenField(name, value){
return "<input type='hidden' name='"+name+"' value='"+value+"'>\n";
}

这样就可以使用 form 表单直接提交了

转载于:https://my.oschina.net/ouminzy/blog/803112