千言万语尽在代码中，可以自己看，不清楚留言吧！

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="realData.aspx.cs" Inherits="webapp.realData" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>直流故障录波器</title>

    <link href="content/templates/deepgreen/css/common.css" type="text/css" rel="Stylesheet" />

    <script src="content/easyUI/jquery-1.7.2.min.js" type="text/javascript"></script>

    <script src="content/easyUI/jquery.easyui.min.js" type="text/javascript"></script>

    <script src="content/easyUI/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>

    <script src="Scripts/Common.js" type="text/javascript"></script>

    <link href="content/easyUI/themes/gray/easyui.css" rel="stylesheet" type="text/css" />

    <link href="content/easyUI/themes/icon.css" rel="stylesheet" type="text/css" /> 

      <script type="text/javascript">

        function pagerFilter(data) {

            if (typeof data.length == 'number' && typeof data.splice == 'function') {    // 判断数据是否是数组

                data = {

                    total: data.length,

                    rows: data

                }

            }

            var dg = $(this);

            var opts = dg.datagrid('options');

            var pager = dg.datagrid('getPager');

            pager.pagination({

                onSelectPage: function (pageNum, pageSize) {

                    opts.pageNumber = pageNum;

                    opts.pageSize = pageSize;

                    pager.pagination('refresh', {

                        pageNumber: pageNum,

                        pageSize: pageSize

                    });

                    dg.datagrid('loadData', data);

                }

            });

            if (!data.originalRows) {

                data.originalRows = (data.rows);

            }

            var start = (opts.pageNumber - 1) * parseInt(opts.pageSize);

            var end = start + parseInt(opts.pageSize);

            data.rows = (data.originalRows.slice(start, end));

            return data;

        }

        $(function () {

            $.post('handlerRealData.ashx', { action: "ycData" }, function (data) {

                data = eval("(" + data + ")")

                console.log("123344565");

                console.log(data);

                $('#tab_realdatalist').datagrid({ loadFilter: pagerFilter }).datagrid('loadData', data);

            });

            $.post('handlerRealData.ashx', { action: "yxData" }, function (data) {

                data = eval("(" + data + ")")

                console.log("123344565");

                console.log(data);

                $('#tab_statuslist').datagrid({ loadFilter: pagerFilter }).datagrid('loadData', data);

            });

        });

      </script>

</head>

<body>

    <div style="margin: 20px 0 10px 0;">

    </div>

    <div class="easyui-tabs" style="width: 1170px; height: 550px">

        <div title="设备实时数据" style="padding: 10px">

            <table id="tab_realdatalist" data-options="

        rownumbers:true,

        singleSelect:true,

        autoRowHeight:false,

        pagination:true,

        pageSize:10,

         height: 470

        ">

                <thead>

                    <tr>

                  <th field="f_occurtime" width="200">

                            时间

                        </th>

                        <th field="telecode" width="110">

                            测点编号

                        </th>

                        <th field="teleName" width="300">

                            测点名称

                        </th>

                        <th field="f_value" width="100">

                            测点值

                        </th>

                    </tr>

                </thead>

            </table>

        </div>

        <div title="设备状态" style="padding: 10px">

            <table id="tab_statuslist" data-options="

        rownumbers:true,

        singleSelect:true,

        autoRowHeight:false,

        pagination:true,

        height: 470,

        pageSize:10">

                <thead>

                    <tr>

                        <th field="telecode" width="110">

                            测点编号

                        </th>

                        <th field="teleName" width="300">

                            测点名称

                        </th>

                        <th field="f_value" width="100">

                            测点状态

                        </th>

                    </tr>

                </thead>

            </table>

        </div>

    </div>

</body>

</html>

　　

easyui分页，根据网友的一段代码优化了一下的更多相关文章

  1. 【技巧】EasyUI分页组件pagination显示项控制

    我们使用easyui分页时,分页组件显示项有很多,默认如下是这样的: 有时候我们并不想显示这么多控制项,我们可以通过属性来控制:如下来自EasyUI官网: 如下写法,在datagrid中使用,如下控制 ...

  2. easyui分页的使用方法

    使用: $("#tt").datagrid("getPager").pagination(option); 例子: $("#tb").dat ...

  3. MVC 使用Jquery EasyUI分页成功

    先上图吧

  4. easyui 分页实现

    1.用datagrid 做分页显示, 依据API样例,最终解决.废话不说,datagrid分页 有一个附加的分页控件 通过在datagrid中设置pagination:true 就会显示分页 当请求是 ...

  5. 后台使用oracle前台使用easyui分页机制

    前台easyui 的datagrid中设置分页属性: pagination:true,//显示分页 pagePosition:'bottom',//分页栏位置 both 上下 bottom.top p ...

  6. Spring+SpringMVC+MyBatis+easyUI整合优化篇（八）代码优化整理小记及个人吐槽

    日常啰嗦 这两天也一直在纠结这一篇文章该写什么东西,前面临时加的两篇文章就有些打乱了整体节奏,这一篇又想去写一下代码层面优化的事情,可是也不太能抓住重要的点,不太确定从何入手,因为这件事情牵涉了太多技 ...

  7. easyUI分页实现加搜索功能

    前台页面: js代码: ps:pagination为true时会在table下面加上easyUI的分页. load函数会将查询值传给datagrid并传给后台重新加载. DAO.xml为: 后台代码实 ...

  8. (转)EasyUI 分页总结

      最近用到了easyui的分页和搜索栏功能,使用过程中由于运用不熟练导致其间也出现过一些问题,下面做个小结,供大家共同学习.1.首先使用EasyUI 的DataGrid分页,得加载其js类库:< ...

  9. EasyUI 分页 简洁代码

    做分页代码,看到网上很多人实现的方法,那是各种调用,各种获取对象.我很不解,因为Easyui已经给我们了分页的具体实现,为什么有些人要画蛇添足呢. 其实真正的分页,在你的代码中,别人可能都没有注意到, ...

随机推荐

  1. HDFS高级功能

    HDFS的六大高级特性: 安全模式 安全模式是HDFS所处的一种特殊状态,在这种状态下,文件系统只接受读数据请求,而不接受删除.修改等变更请求.在NameNode主节点启动时,HDFS首先进入安全模式 ...

  2. selenuim和phantonJs处理网页动态加载数据的爬取

    一.图片懒加载 什么是图片懒加载? 案例分析:抓取站长素材http://sc.chinaz.com/中的图片数据 #!/usr/bin/env python # -*- coding:utf-8 -* ...

  3. vue elment-ui 样式替换 input select

    # 有时候经常需要替换element-ui的样式 第一种方法: 直接修改源码,样式路径如下 直接修改idnex.css即可. 第二种方法: 直接在当前页面修改,替换掉原来的样式. <style ...

  4. MySQL----ERROR 1071 (42000): Specified key was too long; max key length is 767 bytes

    1.问题描述 在导入同事提供的一个sql文件时候,出现了一个1071错误,总结学习一下: 2.分析问题 错误的字面意思是说mysql字段设置的值太长了,不能大于767个字节,在网上找了一些资料后才知道 ...

  5. 用Java实现adb命令的各种方式

    package com.function; import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.D ...

  6. uiautomator2.0的配置的两种方法

    方法一(使用在线下载的方式导入依赖): 1.首先创建项目工程,创建的项目的android_api版本要与测试的android_api版本一致(24就是24 ,不能26或者17去兼容) 2.然后就是将本 ...

  7. 自写UiAutomator 调试类

    package sms_test; import java.lang.*; import java.util.ArrayList; import java.util.Collection; impor ...

  8. uva-11054-模拟

    题意:一条街有许多卖酒的店,有些店需要进酒,有些店需要出酒,所有的店的需求总和为0,问怎么移动,使酒的移动总和最少. 模拟,考虑一家店的需求为xi,无论是从左或者是从右或者其他形式,让xi->0 ...

  9. python第三方库自动安装脚本

    #python第三方库自动安装脚本,需要在cmd中运行此脚本#BatchInstall.pyimport oslibs = {"numpy","matplotlib&qu ...

  10. linux-2.6.22.6 内核源代码包的文件目录介绍

    下载一个linux-2.6.22.6.tar并解压 再其解压的文件中加入下面的bat脚本 生成当前文件的目录树脚本如下: @rem 此BAT文件名一定不能是"tree.bat",否 ...