• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    JSP+EXt2.0实现分页的方法

    本文实例讲述了JSP+EXt2.0实现分页的方法。分享给大家供大家参考。具体如下:

    JavaScript代码:

    Ext.onReady(function(){
    var sm = new Ext.grid.CheckboxSelectionModel();
    var cm = new Ext.grid.ColumnModel([ 
      new Ext.grid.RowNumberer(), 
      sm, 
        {header:'编号',dataIndex:'id',sortable:true}, 
        {header:'名称',dataIndex:'name',sortable:true}, 
        {header:'性别',dataIndex:'sex',sortable:true,renderer:function(value){ 
        if(value=='male'){ 
         return " span style='color:red;font-weight:bold;'>红男 /span> img src='./img/125.gif'>"; 
        }else{ 
         return " span style='color:green;font-weight:bold;'>绿女 /span> img src='./img/123.gif'>"; 
        }
        }}, 
        {header:'描述',dataIndex:'descn',sortable:true} 
      ]); 
      cm.defaultSortable = true; 
      var ds = new Ext.data.Store({ 
        proxy: new Ext.data.HttpProxy({url:'page.jsp'}), 
        reader: new Ext.data.JsonReader({ 
            totalProperty: 'totalProperty', 
            root: 'root'
      }, 
      [ 
        {name: 'id',mapping:'id'}, 
        {name: 'name',mapping:'name'}, 
        {name:'sex',mapping:'sex'}, 
        {name: 'descn',mapping:'descn'} 
      ]), 
      remoteSort:true
      }); 
      var grid = new Ext.grid.GridPanel({ 
      el: 'grid', 
      title:'Ext Grid Test', 
      width:450, 
      height:410, 
      trackMouseOver:false, 
      loadMask: {msg:'正在加载数据,请稍侯……'}, 
      store:ds, 
      cm: cm, 
      sm:sm, 
      bbar: new Ext.PagingToolbar({ 
          pageSize: 5, 
          store: ds, 
          displayInfo: true, 
          displayMsg: '当前显示 {0} - {1}条记录 /共 {2}条记录', 
          emptyMsg: "No topics to display"
        }) 
      }); 
      grid.render(); 
      ds.load({params:{start:0, limit:5}}); 
    });
    
    

    JSP代码:

    %@ page language="java" pageEncoding="UTF-8"%>
    % 
    String start = request.getParameter("start"); 
    String limit = request.getParameter("limit");
    int index = Integer.parseInt(start); 
    int pageSize = Integer.parseInt(limit); 
    String json = "{totalProperty:100,root:["; 
    String sex="";
    for (int i = index; i  pageSize + index; i++) { 
    if(i%2==0)
    {
      sex="male";
    }
    else{
      sex="female";
    }
      json += "{id:" + i + ",name:'" + i + "',sex:'"+sex+"',descn:'descn" + i 
      + "'}"; 
      if (i != pageSize + index - 1) { 
      json += ","; 
      } 
    } 
    json += "]}"; 
    response.getWriter().write(json); 
    System.out.print(json); 
    %>
    
    

    希望本文所述对大家的JSP程序设计有所帮助。

    您可能感兴趣的文章:
    • JavaScript实现列表分页功能特效
    • js脚本分页代码分享(7种样式)
    • 纯javascript实现分页(两种方法)
    • ANGULARJS中使用JQUERY分页控件
    • JSP实现的简单分页示例
    • 使用Jquery+Ajax+Json如何实现分页显示附JAVA+JQuery实现异步分页
    • JSP实现的简单分页显示效果代码
    • JSP通用分页框架
    • jquery+json实现分页效果
    • jquery分页插件jquery.pagination.js使用方法解析
    • jquery分页插件jquery.pagination.js实现无刷新分页
    • Angular.js与Bootstrap相结合实现表格分页代码
    • js实现ajax分页完整实例
    • js多功能分页组件layPage使用方法详解
    • 基于Vue.js的表格分页组件
    • 纯JS前端实现分页代码
    上一篇:JSP验证码动态生成方法
    下一篇:动态JSP页生成静态HTML的方法
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    JSP+EXt2.0实现分页的方法 JSP+EXt2.0,实现,分页,的,方法,