js怎样获得后台Model中的值？
public String objectMethod2Send(Person person,Model model){
System.out.println("**************************");
System.out.println("举例2");
System.out.println("后台已接收前端Person对象"+person);
User user=new User();
user.setId(3);
user.setName("张三");
user.setCompany("Adobe");
model.addAttribute("user",user);
System.out.println("**************************");
return "object/objectMethod2Receive";
}
前端js怎么获得User对象?谢谢！ 展开
一、通用的thymeleaf模板引擎通过returnmodel和view获取后台返回的数据。项目中的pom.xml文件引用了与thymeleaf相关的包。
二、在相应的controller方法中设置要返回的数据。
三、在HTML页面上引用thymeleaf标记。
四、引用controller在HTML标记中返回的数据。
五、返回的controller可以在JS中获取。
七鑫易维信息技术
2024-09-02 广告
1、通用Thymeleaf模板引擎获取后台通过return ModelAndView返回的数据。在项目中的pom.xml文件引用Thymeleaf相关的包。
2、在对应的controller方法中设置需要返回的数据。
3、在html页面上引用Thymeleaf标签。
4、在html标签中引用controller返回的数据。
5、在js中即可获取controller返回的Model数据。
1、新建一个HTML文件，并定义一个：下拉列，表示例代码：<select name="sop" id="sop">
<option value="0">op-1</option><option value="1">op-2</option><option value="2">op-3</option></select>。
2、定义JS标签，JS操作第一步：（取对象），获取JS要操作的DOM对象示例代码：var sop=document.getElementById("sop");。
3、取索引，获取JS对象的索引值（index）示例代码：var index=sop.selectedIndex;。
4、取值，获取JS操作对象的值（value）。
5、如果JS的操作是要取内容（text），需要用到索引值，否则会报“undefined”。
6、js获得了后台Model中的值。
获取id ${user.id}
获取name ${user.name}
获取company ${user.company}
JS中直接从java后台获得对象的值（数组的值）
这里举得例子是：JS直接从后台Contorller中（SpringMVC中的model中）获得数值的值
Contorller 此处将 talentIntegralRecordsDay talentIntegralRecordsIntegral 两个数组用JSON.toJSONString()封装。
@SuppressWarnings("deprecation")
@RequestMapping("/integralParadise") public ModelAndView Welcome(HttpServletRequest request){
Users user = userService.currentUser(request);
user.getTalentUser().getIntegral();
System.out.println(user.getTime().getDate());
TalentIntegralRecord[] signInTalentIntegralRecords= wechatIntegralService.getUserSignInTalentIntegralRecords(user.getId()); int size = signInTalentIntegralRecords.length; int[] talentIntegralRecordsDay = new int[size];
Long[] talentIntegralRecordsIntegral = new Long[size]; for(int i=0;i<signInTalentIntegralRecords.length;i++){
talentIntegralRecordsDay[i]=signInTalentIntegralRecords[i].getOperatorTime().getDate();
talentIntegralRecordsIntegral[i]=signInTalentIntegralRecords[i].getIntegral();
}
Map<String,Object> map = new HashMap<String,Object>();
map.put("talentIntegralRecordsDay", JSON.toJSONString(talentIntegralRecordsDay));
map.put("talentIntegralRecordsIntegral", JSON.toJSONString(talentIntegralRecordsIntegral)); return new ModelAndView("wechat/integralParadise/rili",map);
}
前台JSP 因为用到两个数组数据的JS代码为页面引用的JS代码所以要在页面中先声明获得后台两个数组（这段JS代码应在引用的JS文件前面）
<script type="text/javascript">
$(document).ready(function(){
window.talentIntegralRecordsDay = ${talentIntegralRecordsDay};
window.talentIntegralRecordsIntegral = ${talentIntegralRecordsIntegral};
});</script>
引用的JS文件 开始就获得了两个数组的值
$(function() { var signFun = function() {
var dateArray = window.talentIntegralRecordsDay;// 假设已经签到的
var talentIntegralRecordsIntegral = window.talentIntegralRecordsIntegral; var $dateBox = $("#js-qiandao-list"),
$currentDate = $(".current-date"),
$qiandaoBnt = $("#js-just-qiandao"),
_html = '',
_handle = true,
myDate = new Date();
$currentDate.text(myDate.getFullYear() + '年' + parseInt(myDate.getMonth() + 1) + '月' + myDate.getDate() + '日'); var monthFirst = new Date(myDate.getFullYear(), parseInt(myDate.getMonth()), 1).getDay(); var d = new Date(myDate.getFullYear(), parseInt(myDate.getMonth() + 1), 0); var totalDay = d.getDate(); //获取当前月的天数
for (var i = 0; i < 42; i++) {
_html += ' <li><div class="qiandao-icon"></div></li>'
}
$dateBox.html(_html) //生成日历网格
var $dateLi = $dateBox.find("li"); for (var i = 0; i < totalDay; i++) {
$dateLi.eq(i + monthFirst).addClass("date" + parseInt(i + 1)); for (var j = 0; j < dateArray.length; j++) { if (i == dateArray[j]) {
$dateLi.eq(i).addClass("qiandao"); var integral; if(talentIntegralRecordsIntegral[j]==0){
integral="大转盘";
}else{
integral="+"+talentIntegralRecordsIntegral[j];
}
$dateLi.eq(i).find("div").text(integral);
}
}
} //生成当月的日历且含已签到
$(".date" + myDate.getDate()).addClass('able-qiandao');
$dateBox.on("click", "li", function() { if ($(this).hasClass('able-qiandao') && _handle) {
$(this).addClass('qiandao');
qiandaoFun();
}
