LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui

LoT.UI开源地址如下:https://github.com/dunitian/LoTCodeBase/tree/master/LoTUI

先看在LoT.UI里面的应用效果图:

关键代码解析:

  引用部分:

  

  

  HTML代码:  

<div id="lotToolbar" class="btn-group">
<button type="button" class="btn btn-default" id="lotadd"><i class="glyphicon glyphicon-plus"></i></button>
<button type="button" class="btn btn-default" id="lotrerecover"><i class="glyphicon glyphicon-share-alt"></i></button>
<button type="button" class="btn btn-default" id="lotremove"><i class="glyphicon glyphicon-trash"></i></button>
</div>
<table id="lotTable"></table>

  初始化Js代码(建议):

  

var lotTab = $('#lotTable');$(document).ready(function () {lotTab.bootstrapTable({toolbar: '#lotToolbar',                     //自定工具method: 'get',                              //请求方式url: '/Demo/data.json',                     //请求地址queryParams: { searchText: '' },            //传递参数height: 500,                                //表格高度pagination: true,                           //启用分页pageSize: 10,                               //每页条数pageList: [20, 50, 100, 200, 500],          //显示条数search: true,                               //启用搜索searchOnEnterKey: true,                     //回车搜索//strictSearch: true,                       //精确搜索(默认模糊)showColumns: true,                          //内容选框showRefresh: true,                          //启用刷新clickToSelect: true,                        //单行选中showPaginationSwitch: true,                 //条数显示maintainSelected: true,                     //记住选中(分页或搜索时保留选中状态)striped: true,                              //隔行变色//escape: true,                               //转义HTML(不需要自己转义了)columns: [{field: 'State',checkbox: true},{field: 'Id',title: '序列号',align: 'center',sortable: true},{field: 'SName',title: '超市名',align: 'center',sortable: true,},{field: 'MName',title: '菜单名',align: 'center',sortable: true},{field: 'MPrice',                           //字段名字title: '价格点',                           //标题名字align: 'center',                           //对齐方式sortable: true,                            //支持排序formatter: function (value, row, index) {  //格式方法//保留小数点两位var s = value.toString();var rs = s.indexOf('.');if (rs < 0) {rs = s.length;s += '.';}while (s.length <= rs + 2) {s += '0';}return s;}},{field: 'MType',title: '所属类',align: 'center',sortable: true},{title: '单操作',align: 'center',formatter: function (value, row, index) {return '<a href="#' + row.Id + '" class="edit glyphicon glyphicon-pencil"></a>  <a href="#" class="remove glyphicon glyphicon-trash"></a>';},events: {'click .edit': function (e, value, row, index) {location.href = 'Edit.html?id=' + row.Id;},'click .remove': function (e, value, row, index) {updateData(row.Id, 99);}}}],select: true});});

组件地址:https://github.com/wenzhixin/bootstrap-table

03.LoT.UI 前后台通用框架分解系列之——多样的表格相关推荐

  1. 08.LoT.UI 前后台通用框架分解系列之——多样的Tag选择器

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  2. 07.LoT.UI 前后台通用框架分解系列之——强大的文本编辑器

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  3. 01.LoT.UI 前后台通用框架分解系列之——小图片背景全屏显示(可自动切换背景)...

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  4. 视频教程-游戏UI界面框架设计系列视频课程-Unity3D

    游戏UI界面框架设计系列视频课程 二十多年的软件开发与教学经验IT技术布道者,资深软件工程师.具备深厚编程语言经验,在国内上市企业做项目经理.研发经理,熟悉企业大型软件运作管理过程.软件架构设计理论. ...

  5. Android通用框架设计与完整电商APP开发系列文章

    作者|傅猿猿 责编|Javen205 有福利 有福利 有福利 鸣谢 感谢@傅猿猿 邀请写此系列文章 Android通用框架设计与完整电商APP开发 课程介绍 [[导学视频](http://szv1.m ...

  6. 基于 Ruby 谈谈——程序设计语言的通用框架

    基于 Ruby GScript 谈谈--程序设计语言的通用框架 目录 基于 Ruby GScript 谈谈--程序设计语言的通用框架 一.架构思维导图 1.Ruby GScript 介绍 2.实践: ...

  7. SLAM的通用框架:GSLAM

    SLAM的通用框架:GSLAM GSLAM: A General SLAM Framework and Benchmark 论文链接: http://openaccess.thecvf.com/con ...

  8. 拿transformer做E2E全景分割,这个通用框架霸榜挑战赛,南大、港大联合提出

    视学算法报道 机器之心编辑部 本文中,来自南大.港大.英伟达等机构的研究者提出了一个使用 transformer 进行端到端全景分割的通用框架,不仅为语义分割与实例分割提供了统一的 mask 预测工作 ...

  9. Transformer霸榜全景分割任务,南大、港大提出一种通用框架!

    来源:机器之心 本文中,来自南大.港大.英伟达等机构的研究者提出了一个使用 transformer 进行端到端全景分割的通用框架,不仅为语义分割与实例分割提供了统一的 mask 预测工作流程,而且使得 ...

最新文章

  1. ccf-csp #201912-1 报数
  2. php jira,php – 为Jira的api添加附件
  3. SSM中jsp向后台Controller传值中文乱码的奇葩解决!!!
  4. 根据您的命令-命令设计模式
  5. 公司电脑监控软件_公司电脑监控软件,如何限制公司电脑网络游戏
  6. Shell_参数替换(転)
  7. Spring框架中的控制反转和依赖注入
  8. java word转图片tiff_Word 2010中将文档保存为TIFF图片的方法
  9. php中get结合mysql_php中,$_GET中的数值能被mySQL读到么?
  10. java前台计算date差_js前台计算两个日期的间隔时间
  11. 微软中文论坛2010新年Party手记
  12. check_mk自定义监控增加性能数据图形展示
  13. xmind怎么在左边创建_威纶通 触摸屏自动化应用篇 创建程序界面及画面应用
  14. webpack+vue动态加载组件尝试
  15. Java基础之Java 修饰符
  16. 在从服务器接收结果时发生传输级错误。(provider: TCP 提供程序, error: 0 - 信号灯超时时间已到)...
  17. Python数据挖掘——概况
  18. Linux内核的WRITE_ONCE函数分析
  19. 小红书探店流程有哪些?小红书探店博主如何联系?
  20. Qt调用7z实现压缩和解压缩

热门文章

  1. 一些实用的注册表封装类
  2. 你有没有想过: 为什么Java中String是不可变的?
  3. [洛谷P4722]【模板】最大流 加强版 / 预流推进
  4. rsyslog的学习
  5. ubuntu数据库安装配置
  6. DIV + CSS布局的一些知识汇总
  7. C++中public、protected、private的差别
  8. ubuntu下解决Ruby安装后缺少openssl的问题
  9. Js中判断变量存不存在的问题
  10. 尺取法 POJ 3601 Subsequence