Slider 滚动条 Pagination分页插件 JS Ajax 数据范围筛选 加载 翻页 笔记

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

入职以后的第二个任务  根据用户所选的价格范围 筛选数据

修复BUG - 筛选数据后 总数没有更新、列表显示错误、翻页加载错误

用到的一些知识点

jquery插件系列之 - Slider滑块

max : Number : 100       设置滑动条的最大值。

初始：$('.selector').slider({ max: 7 });       获取：var max = $('.selector').slider('option', 'max');       设置：$('.selector').slider('option', 'max', 7);

min : Number : 0      设置滑动条的最小值。

初始：$('.selector').slider({ min: -7 });       获取：var min = $('.selector').slider('option', 'min');       设置：$('.selector').slider('option', 'min', -7

value    获取或设置当前滑动条的值。

用法：.slider( 'value' , [value] )

stop : slidestop       当滑块停止滑动时，触发此事件。

初始：$('.selector').slider({ stop: function(event, ui) { ... } });       绑定：$('.selector').bind('slidestop', function(event, ui) { ... });

jQuery Pagination分页插件

使用方法

跟一般的jQuery插件一样，此插件使用也很简单便捷。方法是pagination，例如$("#page").pagination(100);

参数

让人比较头疼的是 原来的处理，这个页面有多个列表全都是用同一个JS脚本同一个存储过程根据表单类型不同查询生成分页后的table的。

但是只有这个QWA列表需要价格筛选，于是就出现了以上列出的BUG   筛选数据后 总数没有更新、列表显示错误、翻页加载错误

修改步奏是

当 slider().on('slideStop', function (ev) 获取数据范围，加载重写的独立方法

根据当前的范围筛选符合条件的数据行。

之前想着不改BLL层，然后直接DataTable.Select ，结果只筛选了当前页的。

于是只能单独新建一个存储过程，传入数据范围筛选。