jQuery动态生成不规则表格前后端

时间:2022-12-30 10:11:37

一、需求:有这么一张表

jQuery动态生成不规则表格前后端

前四个属性当作联合主键

需要把该表所有的行在前端以表格形式显示出来,要求activityId相同时合并成一行,activityCode相同时,合并一行,activityVersion相同时也合并一行。类似这种:

jQuery动态生成不规则表格前后端

二、初解决:先上来把数据库的数据查询出来,以List<Activity> activities保存,再存到json对象中传回页面。像这样json.put("activities",activities);

  到js页面了,然后就开始蒙蔽了。本来jqeury就小白,遇到这种情况就更没办法了。

三、问大牛:大牛给我提供了两种思路:我的理解是遇到这种情况可以先把数据在后台封装成你需要的数据结构,在传到前台,就会很好处理。

  第一种:构造Map:Map<String,Map<String,List<Activity>>>

  第二中:构造List:这种需要封装出新的java对象.形如:List<ActivityCode>.

      对象ActivityCode有List<ActivityVersion>这个属性,对象ActivityVersion有属性List<Activity>

  我用的是第一种:首先转换数据结构:

      

    public static Map<String, Map<String, List<Activity>>> listToMap(
List<Activity> activities) {
Map<String, Map<String, List<Activity>>> map = new HashMap<String, Map<String, List<Activity>>>();
for (Activity detail : activities) {
if (!map.containsKey(detail.getActivityCode())) {
Map<String, List<Activity>> mapValue = new HashMap<String, List<Activity>>();
List<Activity> listValue = new ArrayList<Activity>();
listValue.add(detail);
mapValue.put(detail.getActivityVersion(), listValue);
map.put(detail.getActivityCode(), mapValue);
} else {
Map<String, List<Activity>> mapValue = map.get(detail
.getActivityCode());
if (!mapValue.containsKey(detail.getActivityVersion())) {
List<Activity> listValue = new ArrayList<Activity>();
listValue.add(detail);
mapValue.put(detail.getActivityVersion(), listValue);
} else {
List<Activity> mapValueList = mapValue.get(detail
.getActivityVersion());
mapValueList.add(detail);
mapValue.put(detail.getActivityVersion(), mapValueList);
}
}
}
return map;
}

  然后就jQuery遍历map就好了

四、总结:不会要多问

jQuery动态生成不规则表格前后端的更多相关文章

  1. jQuery动态生成Bootstrap表格

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  2. jQuery动态生成&lt&semi;select&gt&semi;下拉框

    前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方 ...

  3. Jquery 动态生成表单 并将表单数据 批量通过Ajax插入到数据库

    利用Jquery 动态生成 Table 表单 之后利用each 方法来遍历所有文本框获取文本的value值  并通过Ajax 将数据 提交到Web服务里把数据插入数据库 Html页面 <!DOC ...

  4. Jquery解析Json字符串&comma;并且动态生成数据表格Table

    //ajax获得后台传来的json字符串 $.post("UserInfo.ashx", function (data) { //假设data="{T1:[{User_I ...

  5. jquery 动态生成html后click事件不触发原因

    转自:http://www.iam3y.com/html/560.html 最近在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<spa ...

  6. 毕业设计---jQuery动态生成的a标签的事件绑定

    这几天在毕业设计的前端设计阶段,准备放弃使用jsp,完全通过html+ajax+SSH进行网站的编写,在前端的页面显示我准备使用jQuery来实现数据的动态绑定.但是遇到动态添加的a标签无法直接通过$ ...

  7. jquery动态生成html代码绑定事件

    今天工作中需要在页面动态生成html代码,但发现新生成的代码的click事件失效了(非动态生成的代码已经绑定了click事件),于是在网上找了很多解决办法,很多都比较复杂,且使用的jquery都比较老 ...

  8. jquery动态生成二维码添加自定义logo

    动态生成二维码中间带logo. jquery.qrcode.js 动态生成二维码api很简单. 引入jquer(版本任意),引入jquery.qrcode.js 不需要中间带logo这样就可以了.带l ...

  9. jquery动态生成的元素添加事件的方法

    动态生成的元素如果要添加事件,要写成 $(document).on("click", "#txtName", function() { alert(this.v ...

随机推荐

  1. VMware Ubuntu Kaldi

    1.VMware10.0 秘钥网上搜就好了 2.ubuntu12.04 (1)安了几次14.04,16.04,12.04,最后窗口和分辨率的bug 还是没有解决 (2)终端显示菱形乱码的解决:直接用英 ...

  2. 调整busybox中syslogd读取内核printk信息长度

    busybox 默认读取内核printk信息长度256, 通过CONFIG_FEATURE_SYSLOGD_READ_BUFFER_SIZE宏可调整, 如下: #cd busybox-1.21.1#m ...

  3. C语言流程控制

    顺序结构 顺序结构是最常用的结构,即从上到下的执行语句. int num=5; num++; num=13; 条件结构 条件结构是当表达式为真的时候执行语句块,C语言提供了两种条件结构 if...el ...

  4. HDU 1711 Number Sequence(数列)

    HDU 1711 Number Sequence(数列) Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Ja ...

  5. SurfaceView 和 TextureView

    1.区别 The followings are two limitations of SurfaceView: You can not be animated, transformed and sca ...

  6. Coprimes - SGU 102(求互质数,水)

    题目大意:给你一个正整数N,求出来不超过N 的并且与N互质的正整数的个数. 就是一个大水题~~~ 代码: #include<stdio.h> #include<string.h&gt ...

  7. COJ 3012 LZJ的问题 (有向图判环)

    传送门:http://oj.cnuschool.org.cn/oj/home/problem.htm?problemID=1042 试题描述: LZJ有一个问题想问问大家.他在写函数时有时候很头疼,如 ...

  8. mac平台adb、tcpdump捕手android移动网络数据包

    在移动电话的发展app当我们希望自己的下才能看到app网络发出请求,这个时候我们需要tcpdump工具包捕获.实现tcpdump空灵,以下步骤需要: 在这里,在android 华为手机 P6对于样本 ...

  9. 在Vue中使用样式

    ##使用class样式 一共四种方式在注释中有解释 <!DOCTYPE html> <html> <head> <meta charset="utf ...

  10. MVC 获取控制器名称和Action名称(转载)

    MVC在filter中如何获取控制器名称和Action名称   使用ActionExecutingContext对象可以获取控制器名称.Action名称.参数名称以及参数值.路由和Action返回值不 ...