Javascript 如何使用jQuery生成数组列表的对象
我的项目基于springboot、Thymeleaf、mysql、html和jQuery。我的场景是获取动态生成的输入框数据,需要执行静态输入框数据并点击@controller 我想以JSON格式发布,类型为List EntPropertySub,意思是类类型的列表,我对如何在jQuery中创建列表感到困惑。我试图制作一个对象数组,但似乎出错了。请引导我。下面是一个示例代码Javascript 如何使用jQuery生成数组列表的对象,javascript,jquery,arrays,arraylist,Javascript,Jquery,Arrays,Arraylist,我的项目基于springboot、Thymeleaf、mysql、html和jQuery。我的场景是获取动态生成的输入框数据,需要执行静态输入框数据并点击@controller 我想以JSON格式发布,类型为List EntPropertySub,意思是类类型的列表,我对如何在jQuery中创建列表感到困惑。我试图制作一个对象数组,但似乎出错了。请引导我。下面是一个示例代码 var max; var blockname; var floors; var flatstart; var flaten
var max;
var blockname;
var floors;
var flatstart;
var flatend;
var blockListPropSub[];
for(max=1;max<=x;max++) {
blockListPropSub[max] = {
blockname = $('#block'+max).val();
floors=$('#floor'+max).val();
flatstart=$('#flats'+max).val();
flatend=$('#flatsend'+max).val();
};
}
var最大值;
var块名;
var楼层;
无功平坦起动;
无功平端;
var blockListPropSub[];
对于(max=1;max首先,必须将BlockListPropSub设置为数组,var BlockListPropSub=[]
然后使用类似于blockname:$('#block'+max).val()的方法设置blockname的值
var最大值;
var块名;
var楼层;
无功平坦起动;
无功平端;
var blockListPropSub=[];
对于(max=1;max),您需要将对象文本中的=
替换为:
。感谢您的回复,但这里是$('#block'+max).val();输入框id,其值取自HTML…请参阅此处制作的完整脚本。
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $("#addingInp"); //Fields wrapper
var add_button = $("#addButton"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment now x=1 after x++ x=2,so next code 2%2==0 is true
$(wrapper).append('<div style="margin-top: 20px" class="form-row">'
+'<div class"form-group col-md-3">'
+'<label for="block'+x+'">Block</label>'
+'<input id="block'+x+'" th:field="*{blockListPropSub.blockname}" type="text" name="mytext[]" class="form-control block" placeholder="Enter Name"/>'
+'</div>'
+'<div class"form-group col-md-4">'
+'<label for="floor'+x+'">No of floors</label>'
+'<input id="floor'+x+'" th:field="*{blockListPropSub.floors}" type="text" name="mytext[]" class="form-control floor" placeholder="Start (Ex : 1)"/>'
+'</div>'
+'<div class"form-group col-md-4">'
+'<label for="flats'+x+'">No/Name of flats</label>'
+'<input id="flats'+x+'" th:field="*{blockListPropSub.flatstart}" type="text" name="mytext[]" class="form-control flatstart" placeholder="Start (Ex : A or 1)"/>'
+'<input id="flatsend'+x+'" th:field="*{blockListPropSub.flatend}" type="text" name="mytext[]" class="form-control flatend" placeholder="End (Ex : Z or 100)"/>'
+'</div>'
+'<a href="#" class="remove_field col-md-1"> X </a>'
+'</div>'); //add input box
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
//--------------------For Submitting` data to controller
var url = window.location;
// SUBMIT FORM
$("#socityreg").submit(function(event) {
// Prevent the form from submitting via the browser.
event.preventDefault();
ajxPost();
});
function ajxPost(){
var max;
var blockname;
var floors;
var flatstart;
var flatend;
var blockListPropSub[];
for(max=1;max<=x;max++)
{
blockListPropSub[max]={
blockname = $('#block'+max).val();
floors=$('#floor'+max).val();
flatstart=$('#flats'+max).val();
flatend=$('#flatsend'+max).val();
};
}
alert(blockListPropSub.blockname[1]);
// PREPARE FORM DATA
var formData = {
property_name : $("#propertyname").val(),
address1 : $("#inputaddress").val(),
address2 : $("#inputaddress2").val(),
city:$("#inputcity").val(),
state:$("#inputstate").val(),
country:$("#inputcountry").val(),
zipcode:$("#inputzip").val(),
blockListPropSub
}
// DO POST
$.ajax({
type : "POST",
contentType : "application/json",
url : url+"/savemasterproperty",
data :JSON.stringify(formData),
dataType : 'json',
success : function(result) {
if(result == "saved"){
$("#resultid").html("<strong>" +username+ " Registered Successfully!" );
}else{
$("#resultid").html("<strong>Error</strong>");
}
alert(result.status);
console.log(result);
},
error : function(e) {
alert("Error!");
alert(url);
console.log("ERROR: ", e);
}
});
// Reset FormData after Posting
//resetData();
}
/* function resetData(){
property_name : $("").val(),
address1 : $("").val(),
address2 : $("").val(),
city:$("").val(),
state:$("").val(),
country:$("").val(),
zipcode:$("").val(),
}*/
});