ajax如何给后台实体中的实体传参,后台接收的实体中包含List,前台ajax如何传参...

这段代码展示了前端如何通过JavaScript收集用户在单选、多选及文本输入的数据,并构造成JSON格式,然后使用AJAX异步提交到后台。后台通过`@RequestBody`注解接收并处理这些数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前端代码

function a() {

var redio = $("input:hidden[id='redio']").val();

var checkbox = $("input:hidden[id='checkbox']").val();

var text = $("input:hidden[id='text']").val();

console.info(redio);

console.info(checkbox);

console.info(text);

var answerRecordList =[];//这是后台的list

//单选框

$.each( redio.split(','),function(index,value){

if(value.length>0){

console.info("单选框:"+value+":"+$("input[name="+value+"]:checked").val());

var answerRecord={"questionId":value,"optionId":$("input[name="+value+"]:checked").val()};

answerRecordList.push(answerRecord);

}

});

//多选框

$.each( checkbox.split(','),function(index,value){

if(value.length>0){

$('input[name='+value+']:checked').each(function(){//遍历每一个名字为interest的复选框,其中选中的执行函数

// chk_value.push($(this).val());//将选中的值添加到数组chk_value中

console.info("多选框:"+value+":"+$(this).val());

var answerRecord={"questionId":value,"optionId":$(this).val()};

answerRecordList.push(answerRecord);

});

}

});

//文本框

$.each( text.split(','),function(index,value){

if(value.length>0){

console.info("文本框:"+value+":"+$(" #"+value).val());

var answerRecord={"questionId":value,"answer":$(" #"+value).val()};

answerRecordList.push(answerRecord);

}

});

var data={

"naireId":1,

"startTime":"2020-01-01",

"telephone":$(" #tel ").val(),"name":$(" #name ").val(),

"answerRecordList":answerRecordList//后台list

}

//alert(JSON.stringify(data));

console.info(data);

$.ajax({

url: "/record/insert", //url

type: "post", //请求类型 ,

async:true,

contentType:"application/json",//这个是关键

// content-type : "application/json",

// dataType: "json", //返回的数据类型 ,跟后台配合好 ,一般都是json,

//data:JSON.stringify(data),

data:JSON.stringify(data),

success: function(data) {

console.log(data);

},

error:function(){

alert("登录服务器异常!!!");

}

后台代码:

@PostMapping("insert")

@ResponseBody

public AjaxResult insert(@RequestBody Record record)//@RequestBody是关键

{

return toAjax(recordService.insert(record));

}

Record类:

public class Record

{

private static final long serialVersionUID = 1L;

/** 主键 */

private Long id;

/** 调查问卷表id */

private Long naireId;

/** 微信的openId */

private String openId;

/** 开始答题时间 */

private Date startTime;

/** 结束答题时间 */

private Date endTime;

/** 手机号 */

private String telephone;

/** 姓名 */

private String name;

private ListanswerRecordList;

}

AnswerRecord类:

public class AnswerRecord

{

private static final long serialVersionUID = 1L;

/** 主键 */

private Long id;

/** 问卷记录表id */

private Long recordId;

/** 问题表id */

private Long questionId;

/** 选项表id */

private Long optionId;

/** 答案 */

private String answer;

}

转载请注明出处

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值