GridManager 实现搜索

搜索功能在GridManager中的实现方式很简单。
首先需要确认当前的GridManager已经渲染成功, 如何渲染请 点击这里

获取被实例化的 table标签
var tableDOM = document.querySelector('table');

当GridManager 渲染成功后, 会在原 table 标签的原型上增加 GM 方法; 通过该方法可以做很多事情, 比方说搜索。

这里说明一下,为了不过多的侵占 Element.prototype 的属性, 并未将所有的方法都添加至 table 的原型上。 而是采用首参数为方法名的方式。

比如说 tableDOM.GM('init'), 就是调用了 init 方法。

通过GM 调用 setQuery 方法, 进行搜索
// 假设触发搜索后,获取到的搜索条件为 query
var query = {'userName':'baukh','sex':'男'};
tableDOM.GM('setQuery', query);
setQuery 方法介绍

更改在生成组件时所配置的参数 query,执行后将会自动刷新表格数据。

需要注意的是:

  1. query 的 key 值如果与分页及排序等字段冲突, query 中的值将会被忽略.

  2. setQuery() 会立即触发刷新操作

  3. 在此配置的 query 在分页事件触发时, 会以参数形式传递至 pagingAfter(query) 事件内

  4. setQuery 对 query 字段执行的操作是修改而不是合并, 每次执行 setQuery 都会将之前配置的 query 值覆盖

  5. query中的字段如果与分页字段相冲突,将失效。

参数说明

query:

需要更改的 query 信息,为 json 类型。格式=> {'userName':'baukh','sex':'男'}

isGotoFirstPage:

是否返回第一页, Boolean 类型。默认值 true;

callback:

回调函数

作者:@拭目以待表格管理开源项目GridManager

Want to know How To Make Love?I know HTML!

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,923评论 18 139
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,765评论 18 399
  • 一. Java基础部分.................................................
    wy_sure阅读 3,835评论 0 11
  • 由于最近很忙,好一阵子没有打卡了,这也是由于懒惰的原因,今晚环姐找我聊了很久,环姐说得很对,不管那天有没有学习,都...
    237c27e82c85阅读 231评论 0 0
  • 一个像虫子吃树叶一样,溃疡则烂的一塌糊涂。就是这样。
    withism阅读 189评论 1 0