jQuery+json实现动态创建复杂表格table的方法


Posted in Javascript onOctober 25, 2016

本文实例讲述了jQuery+json实现动态创建复杂表格table的方法。分享给大家供大家参考,具体如下:

function SetSubTable() {
  var obj = jQuery.parseJSON($("#SubJsonStrValue").val());
  window.ALLPARAMTERS = obj;
  var row_str = "";
  var span_num = 1
  for (var i = 0; i < obj.length; i++) {
    if (obj[i].ParamNames.length > 0) {
      row_str += '<tr><td rowspan="' + obj[i].ParamNames.length + '"><input type="checkbox" name="_'+obj[i].Id+'" />' + obj[i].Name + '</td>';
      for (var j = 0; j < obj[i].ParamNames.length; j++) {
        if (j != 0) {
          row_str += "<tr>";
        }
        row_str += '<td><input type="checkbox" name="p_'+obj[i].ParamNames[j].Id+'_'+obj[i].Id+'" />' + obj[i].ParamNames[j].Name + '</td><td>';
        for (var k = 0; k < obj[i].ParamNames[j].ListItems.length; k++) {
          row_str += obj[i].ParamNames[j].ListItems[k].Name+"|";
        }
        row_str = row_str.substring(0, row_str.length - 2);
        row_str += "</td><td>";
        if (obj[i].ParamNames[j].CanMultiSelecte) {
          row_str += "多选";
        } else {
          row_str += "单选";
        }
        row_str += "</td></tr>";
      }
    }
  }
  $("#sub_table_header").after(row_str);
}
Javascript 相关文章推荐
js直接编辑当前cookie的脚本
Sep 14 Javascript
JavaScript 设计模式学习 Singleton
Jul 27 Javascript
为你的网站增加亮点的9款jQuery插件推荐
May 03 Javascript
JavaScript:new 一个函数和直接调用函数的区别分析
Jul 10 Javascript
认识Knockout及如何使用Knockout绑定上下文
Dec 25 Javascript
封装属于自己的JS组件
Jan 27 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
javascript循环链表之约瑟夫环的实现方法
Jan 16 Javascript
vue的全局变量和全局拦截请求器的示例代码
Sep 13 Javascript
微信小程序中转义字符的处理方法
Mar 28 Javascript
详解vue 不同环境配置不同的打包命令
Apr 07 Javascript
package.json各个属性说明详解
Mar 11 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
Oct 25 #Javascript
JavaScript prototype属性详解
Oct 25 #Javascript
对Angular.js Controller如何进行单元测试
Oct 25 #Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
Oct 25 #Javascript
input file上传 图片预览功能实例代码
Oct 25 #Javascript
Node.js开启Https的实践详解
Oct 25 #Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
Oct 25 #Javascript
You might like
用PHP+java实现自动新闻滚动窗口
2006/10/09 PHP
8个出色的WordPress SEO插件收集
2011/02/26 PHP
php结合js实现点击超链接执行删除确认操作
2014/10/31 PHP
PHP 枚举类型的管理与设计知识点总结
2020/02/13 PHP
JAVASCRIPT  THIS详解 面向对象
2009/03/25 Javascript
js中class的点击事件没有效果的解决方法
2016/10/13 Javascript
超全面的javascript中变量命名规则
2017/02/09 Javascript
vue2.0结合Element实现select动态控制input禁用实例
2017/05/12 Javascript
Vue-Cli中自定义过滤器的实现代码
2017/08/12 Javascript
原生JS实现日历组件的示例代码
2017/09/22 Javascript
微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
2018/12/11 Javascript
全面了解JavaScript的作用域链
2019/04/03 Javascript
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
2019/06/04 jQuery
详解vue页面首次加载缓慢原因及解决方案
2019/11/06 Javascript
使用cx_freeze把python打包exe示例
2014/01/24 Python
python实现斐波那契递归函数的方法
2014/09/08 Python
Python实现批量读取word中表格信息的方法
2015/07/30 Python
python多线程分块读取文件
2019/08/29 Python
HTML5 canvas实现的静态循环滚动播放弹幕
2021/01/05 HTML / CSS
vivo智能手机官方商城:vivo
2016/09/22 全球购物
The North Face北面法国官网:美国著名户外品牌
2019/11/01 全球购物
美国眼镜在线零售商:Dualens
2019/12/07 全球购物
我能否用void** 指针作为参数, 使函数按引用接受一般指针
2013/02/16 面试题
函数只定义了一次, 调用了一次, 但编译器提示非法重定义了-什么问题?
2014/10/03 面试题
计算机应用专业毕业生求职信
2013/10/24 职场文书
经典的班主任推荐信
2013/10/28 职场文书
电气工程和自动化自荐信范文
2013/12/25 职场文书
党校培训自我鉴定
2014/02/01 职场文书
致1500米运动员广播稿
2014/02/07 职场文书
岗位职责风险点
2014/03/12 职场文书
供用电专业求职信
2014/07/07 职场文书
我们的节日中秋活动方案
2014/08/19 职场文书
优秀团员自我评价
2015/03/10 职场文书
2015年药房工作总结
2015/04/25 职场文书
2016春节放假通知范文
2015/08/18 职场文书
《黄道婆》教学反思
2016/02/22 职场文书