█ 【web学习之ideaIU】 IntelliJ IDEA - 学习
█ 相关文章:
-
● 【web学习之html】 HTML基础 - 常见语法总结
● 【web学习之html】 HTML基础 - 表单学习
● 【web学习之Js】 JavaScript基础 - 基础语法
● 【web学习之demo】 一个Demo的解析
● 【web学习之eclipse】 用eclipse从git(码云)上下载maven项目
● 【【web学习之交互】 数据交互 - List传输
█ 读前说明:
-
● 本文通过学习别人写demo,学习一些课件,参考一些博客,’学习相关知识,如果涉及侵权请告知
● 本文只简单罗列相关的代码实现过程
● 涉及到的逻辑以及说明也只是简单介绍,主要当做笔记,了解过程而已
█ 本文知识点:
-
● IntelliJ IDEA的下载安装
● $(’#selectStudent’).html(tr);局部更新
● JSONArray 的使用
● eval(data.msg);//字符串转换成js对象
█ IntelliJ IDEA的下载:
-
● 百度输入idea:
● 点击进入官网:
● 下载后如下:
█ 通过在js里面获取,再动态显示 :
-
● 在Controller的java文件中直接传递List对象(方法1):
@ResponseBody @PostMapping(value = "getStudentList", produces = "application/json; charset=utf-8") public List< UserInfo> getStudentList(Model model) { List< UserInfo> items = new ArrayList<>(); return items ; }
● 在Controller的java文件中将List对象转换成字符串(方法2):
@ResponseBody @PostMapping(value = "getStudentList", produces = "application/json; charset=utf-8") public List< UserInfo> getStudentList(Model model) { List< UserInfo> items = new ArrayList<>(); JSONArray jsonArray=new JSONArray(); for (UserInfo item : items ) { jsonArray.add(items); } return jsonArray.toString(); }
● 在前端的html文件中js通过post返回获取对象(方法1):
$.post("../getStudentList",null, function(data) { var val=eval(data.msg);//字符串转换成js对象 var tr = '<option value="0">选择学生</option>'; for (var i=0;i<val.length;i++){ tr = tr + '<option value="'+val[i].id+'">'+val[i].name+'</option>'; } $('#selectStudent').html(tr); });
PS1: console.log(data); 将输出:
[{“id”:1,“name”:“刘一”},{“id”:2,“name”:“陈二”},{“id”:3,“name”:“张三”},{“id”:4,“name”:“李四”},{“id”:5,“name”:“王五”},{“id”:6,“name”:“赵六”}]
PS2: console.log(eval(data)[0].name); 将输出:刘一
PS3: onsole.log(eval(data).length); 将输出:6
PS4: 另外还有JSON.parse(data);可以将字符串转换成对象,只是字符串的格式不太一样
● 在前端的html文件中js通过post返回获取对象(方法2):
$.post("../getStudentList",null, function(data) { var tr = '<option value="0">选择学生</option>'; for (var i=0;i<data.length;i++){ tr = tr + '<option value="'+data[i].id+'">'+data[i].name+'</option>'; } $('#selectStudent').html(tr); });
PS1: console.log(JSON.stringify(data)); 将输出:(同方法1的字符串)
[{“id”:1,“name”:“刘一”},{“id”:2,“name”:“陈二”},{“id”:3,“name”:“张三”},{“id”:4,“name”:“李四”},{“id”:5,“name”:“王五”},{“id”:6,“name”:“赵六”}]
PS2: cnsole.log(data[0].name); 将输出:刘一
PS3: cnsole.log(data.length); 将输出:6
█ 其他:
-
● 1.时间显示,可以直接在js里面将Date进行转换处理:,
<fmt:formatDate value='${createtime}' pattern='yyyy-MM-dd/E HH:mm'/>
显示如下:
PS: 如果将HH:mm写成HH:MM则会将17:35显示为15:11,所以建议时间转换可以直接在服务端转换好,在前端直接显示即可
█ 相关资料:
-
● 1.2018-01-28 SSM将后台获取的数据转换成json格式传递到前台页面 - Fantasy_99 - 博客园
● 2.20161228 js获取springmvc后端传递过来的list对象,并使用select下拉框显示出来 - jaryle的专栏 - CSDN博客l
● 3.2018-07-17 SSM框架动态表格实现批量新增 - Z_SUHE的博客 - CSDN博客
● 4.2017-09-21 SSM之Mybatis查询以及批量操作 - 黄三yeah的Java技术空间 - CSDN博客
● 5.Javascript 教程 - JavaScript JSON.parse() | 菜鸟教程
转载请注明出处:
https://blog.csdn.net/ljb568838953/article/details/84136816