jqgrid 滚动分页

有时,我们不想在底部显示分页信息,而是通过用户滚动鼠标,当鼠标滚到到底自动加载下一页数据,再滚动再加载直至数据全部加载完毕。如何配置?

设置 scroll:true   emptyrecords用于在滚动到数据全部加载完毕后的提示 emptyrecords:"已经到底了"

    $("#jqGrid").jqGrid({
          ...
         scroll: true,//是否启动滚动分页
         emptyrecords: ‘没有数据了‘,//滚到到底以后的提示文
          ...
      });

如果配置为滚动分页,则可以不用给jqgrid加载底部的分页区。可取消以下代码:

    //设置报表说明
    $(‘#jqGrid‘).navGrid(‘#jqGridPager‘,{ edit: false, add: false, del: false, search: false, refresh: false, view: false, position: "left", cloneToTop: false });

时间: 2024-10-09 01:33:31

jqgrid 滚动分页的相关文章

移动端web 滚动分页

前端代码: <script type="text/javascript"> var page = 2; //当前页的页码 var flagNoData = false; //false var allpage = @Model.PageCount; //总页码,会从后台获取 function showAjax(currentIndex) { $.ajax({ url: "@Url.Action("GetEmployeeData", "

DEVExpress For WPF 中GridControl如何实现滚动分页(延迟查询)

在显示大量数据时一般采用分页显示,但是最近用户需要滚动显示,那么问题来了,滚动显示要求将数据全部查询回来,这显然会导致显示速度很慢. 好在想到一种方式,就是当用户滚动鼓动条的时候再查询下面的数据.好吧 不多说了 上代码 private void GridControl_ScrollChanged(object sender,ScrollChangedEventArgs e){ if(e.ViewprotHeight!=e.ExtentHeight&&e.ExtentHeight!=0)//

向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)

/**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name ajax异步的URL中的页码参数名 如pageno page_no 初始加载页码,默认1 [如2,则与前面两参数结合为data.php?pageno=2] is_lazyload 是否开启懒加载 page_count 总页数 empty_msg 没有数据的时候提示(可传输图片) ending_msg

【APS.NET Core】- Razor Page 使用jqgrid实现分页功能

本文将使用jqgrid在Razor Page中实现分页功能. 前台 List.cshtml代码如下: 1 @page 2 @model ListModel 3 @{ 4 Layout = "~/Pages/Shared/_Index.cshtml"; 5 } 6 7 <script> 8 $(function () { 9 gridList(); 10 }); 11 12 function gridList() { 13 var $gridList = $("#g

jqgrid 前端分页

前提: 不能进行后台分页,或者后台添加分页比较麻烦的话, 打算采取前端分页 后台只需要查询全部数据,返回到前端 jqgrid需要后台返回的参数 { page:当前页(默认第一页 =1), total :总页数 (数据库返回总条数/页面分页配置显示的条数), records:数据库查询完的总条数, rows : 数据库查询的数据 } 转成json值,返回到前端 jqgrid初始化时 修改 datatype: "local", 添加 loadonce: true, 查询数据时,加载方式:

jqGrid的分页

1.先导入三个jar包 2.再导入两个css文件 3.最后导入三个js文件 4.jsp里引入css和js文件,注意先后顺序 [html] view plaincopy <link type="text/css" rel="stylesheet" href="css/bootstrap.min.css" media="screen"/> <link type="text/css" rel=&

表格滚动分页

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

JQery easyUI 滚动分页

var s1 = new Date().getTime();     $(document).ready(function(){        var flag = true;        //鼠标滑轮滚动事件的处理        var scrollFunc=function(e){            var s2 = new Date().getTime();            console.log(s2);            if(s2-s1<500) return;//控

js滚动分页原理

<!doctype html><html> <head> <!--声明当前页面的编码集:charset=gbk,gb2312(中文编码),utf-8国际编码--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!--当前页面的三要素--> <title>javaWeb - 导航条</ti