分页之gridmanager

  • 神奇的表格工具——gridmanager
    • gridmanager简介
    • 当然,说什么都不如实际展示
    • 总结

神奇的表格工具——gridmanager

本次项目学习时,因为不曾涉及过前端的相关开发,也不是学习重点,但又涉及到了前端分页展示和后台数据需求,所以老师分享了一个好用的前端表格工具——gridmanager ,以下是我学习时的一些心得。

gridmanager简介

起始于15年末的jQuery 插件 ListManager。在2.0版本时更名为GridManager, 并在 v2.1 中脱离对jQuery的依赖;采用原生JS进行编码,因此无依赖的集成至任何框架。
并发布了相应的Angular-1.x [1] 、Vue [2] 、React [3] 版本。
GridManager是开源免费的软件(MIT 许可证),同时在github [4] 及 开源中国(oschina) [5] 上开源。在维护现有功能的同时,新功能也在持续开发。

优势:
纯原生javascript实现,不依赖任何框架
使用简单快捷,功能强大
与用户进行沟通,采纳来自于使用的需求,并不间段的进行升级维护

功能图:

当然,说什么都不如实际展示

这是我自己后台数据管理所展示的分页效果,可以看见十分的清晰和简洁,分页数据一目了然,除了自动生成分页表格,gridmanager还支持许多页面操作如拖动换位、自主调节表格的高度和宽度,让数据显示更加直观。

因为gridmanager是一个开源项目,我就不展示源码和自己的代码了,有兴趣的朋友可以通过官网下载自行体验,官方网址如下:
链接: gridmanager官网

总结

对于后端开发人员来说,前端的代码模块和设计完全是两个概念,能够有很多方便后台开发的前端软件,对我们来说是十分友好地,在本次项目学习中我深刻认识到开发的难度和深度,也因此收获了很多,希望和我一样的朋友都能够在学习的道路上收获到属于自己的那一份知识和技能。

Gridmanager相关推荐

  1. java mvc 分页查询条件_java分页条件查询-GridManager.js表格插件+Pageable分页对象+mybatis pagehelper分页插件...

    总览: 一. GridManager.js表格插件 直接上插件API:链接地址 感觉该插件简单好用,插件作者也是有问必答,nice 二. 添加依赖 后端: pom文件添加: 1.7.0.RELEASE ...

  2. 表格插件:GridManager

    一.GridManager 可快速.灵活的对table标签进行实例化.使用简单快捷, 功能强大,原生js实现, 不依赖任何框架: 二.特点: 宽度调整:支持用户对表格的列宽度可进行拖拽式调整 位置调整 ...

  3. gridmanager使用于本地数据,使用function来模拟返回后端数据。

    function m(settings, params) {} 参数里包含了基础配置和分页排序信息. 注意:尾页使用此形式则不生效,需要将尾页按钮隐藏. 官网案例调整(直接copy到光网的在线编辑器中 ...

  4. 自定义控件:下拉刷新

    PullToRefresh 下拉刷新 上拉加载 掌握自定义的具有下拉刷新和上拉加载功能的 ListView 掌握自定义的侧边栏 SlidingMenu 在日常开发工作中,应用界面常常都是用ListVi ...

  5. ListView和RecyclerView的Adapter封装

    原文链接 Android 快速开发系列 打造万能的ListView GridView 适配器 为RecyclerView打造通用Adapter 让RecyclerView更加好用 Android 优雅 ...

  6. 黄聪: 50 个 Bootstrap 插件

    Bootstrap是快速开发Web应用程序的前端工具包.它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等. 本文向你 ...

  7. Kotlin binding+RecyclerView实现支付宝首页更多、应用编辑界面

    activity 主布局页面: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xm ...

  8. 50 个 Bootstrap 插件

    Bootstrap是快速开发Web应用程序的前端工具包.它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等. 本文向你 ...

  9. cocos2d JS 源生js实现each方法

    javascript笔记--源生js实现each方法 出处:http://www.lovejavascript.com/#!zone/blog/content.html?id=48 jquery里面有 ...

最新文章

  1. 【记录】入选《开发工具领域内容榜》第6名
  2. 20年研发管理经验谈(三)
  3. 神秘的Waymo一反常态,CVPR现场发布大型自动驾驶数据集
  4. shell中uniq与sort -u 两种去重的对别
  5. php函数用粗体字显示,用来设置粗体字的属性是什么
  6. IEDA中JavaDoc的自动生成、手动生成,以及生成html文档
  7. [前台]---图片上传和校验
  8. Coding-Job:从研发到生产的容器化融合实践
  9. .NET中异常处理最佳实践
  10. Python面试题解答——第三部分Python高级
  11. 免费录屏、直播推流软件之OBS Studio
  12. Python语言实现用于动物分类的产生式系统
  13. PostgreSQL 数据库跨版本升级常用方案
  14. 中国风背景素材|2020设计趋势之中国风
  15. 吴裕雄--天生自然 诗经:古朗月行
  16. 这些联盟可以去注册试一下
  17. 华胜天成旗下成员企业沃趣科技为华泰证券IT系统保驾护航
  18. 如何利用js取得eWebEditor编辑器的内容
  19. vue开发的微信服务号H5内嵌的腾讯地图和导航
  20. 无线串口NRF24L01的使用与调试

热门文章

  1. YAML——基本语法
  2. 超硬核的Java工程师分享,什么是Java?为什么我要做Java,我是如何学习Java的?
  3. Java把文件压缩成.zip压缩包和解压.zip压缩包(ZipOutputStream、ZipInputStream)
  4. 网口调试方式以及性能测试iperf |CSDN创作打卡
  5. 方向导数与梯度的实质理解
  6. 新浪微博登录提示sso package or sign error的原因及解决
  7. 全球IEEE期刊大全(综合整理,附原文论文下载地址)
  8. 2023 华为 Datacom-HCIE 真题题库 12/12(完结)--含解析
  9. linux系统make命令详解
  10. Android Camera2 CameraCharacteristics Key 详细解说