`

struts flexigrid

阅读更多

最近要写一个分页的功能,找了很多的ajax分页资料,都觉得不是很好,本来想用ext的,可是觉得速度有点慢,在加上公司明确要求用jquery+json 实现分页,没办法,后来发现jquery的flexgrid的分页还不错。就花了点时间写了个。

 

 java 代码:

 @Controller
public class InfoIssueAction extends PBaseAction {
 public InfoIssueAction(){};
 @Autowired
 InfoIssueService infoIssueService;

 List rows=new ArrayList();
 protected int rp;
 protected int page=1;
 protected int total;
 
 @SuppressWarnings("unchecked")
 public String showInfoIssue(){
  int startIndex = (page - 1) * rp;     //计算查询开始数据下标       
  total=infoIssueService.getAllInfoIssue().size();
  List list=infoIssueService.getInfoIssue(startIndex, rp);
  for (Iterator iterator = list.iterator(); iterator.hasNext();) {
   InfoIssue infoissue = (InfoIssue) iterator.next();
     Map cellMap = new HashMap(); 
     cellMap.put("issueid", infoissue.getIssueid());
     cellMap.put("cell", new Object[] {infoissue.getIssueid(),infoissue.getCaption(),
       infoissue.getAttribute(),infoissue.getMaketop(),infoissue.getIssued()});
     rows.add(cellMap);
  
  }
  return "listSuccess";
 }


 @JSON(name="rows")
 public List getRows() {
  return rows;
 }

 public void setRows(List rows) {
  this.rows = rows;
 }

 public int getRp() {
  return rp;
 }

 public void setRp(int rp) {
  this.rp = rp;
 }

 public int getPage() {
  return page;
 }


 public void setPage(int page) {
  this.page = page;
 }


 public int getTotal() {
  return total;
 }

 public void setTotal(int total) {
  this.total = total;
 }

}

 

 

jsp代码:

需要导入文件,:

<link rel="stylesheet" type="text/css" href="grid/css/flexigrid/flexigrid.css"></link>
<script type="text/javascript" src="page/js/jquery.js"></script>
<script type="text/javascript" src="page/grid/flexigrid.js"></script>

 

<div class="bborderx">
<table id="flex1" style="display:none"></table>
</div>

 

js代码:

$("#flex1").flexigrid
   (
   {
   url: 'infoIssue/InfoIssue!show.action',
   dataType: 'json',
   colModel : [
    {display: '编号', name : 'issueid', width : 60, sortable : true, align: 'center'},
    {display: '标题', name : 'caption', width : 120, sortable : true, align: 'left'},
    {display: '是否置顶', name : 'maketop', width : 120, sortable : true, align: 'left'},
    {display: '是否发布', name : 'issued', width : 120, sortable : true, align: 'left'}
    ],
   buttons : [
    {name: '增加', bclass: 'add', onpress : test},
    {name: '删除', bclass: 'delete', onpress : test},
    {separator: true}
    ],
   searchitems : [
    {display: '标题', name : 'caption', isdefault: true}
    ],
   sortname: "issueid",
   sortorder: "asc",
   usepager: true,
   title: '新闻发布 ',
   useRp: true,
   rp: 1,
   showTableToggleBtn: true,
   width: 600,
   height: 300
   }
   );
   function test(com,grid)
   {
    if (com=='删除')
     {
         confirm('是否删除这 ' + $('.trSelected',grid).length + ' 条记录吗?')
     }
    else if (com=='增加')
     {
      alert('增加一条!');
     }  
   }

 

 

分享到:
评论

相关推荐

    Flexigrid与struts2的整合使用说明

    这两者的整合使得开发者可以在Struts2应用中利用Flexigrid的优秀特性来展示和操作数据。 Flexigrid的使用说明: 1. 引入库:首先,你需要在HTML页面中引入Flexigrid的CSS和JavaScript文件。这通常包括`flexigrid....

    flexigrid集成Struts实现动态添加删除

    flexigrid表格控件的使用实例,实现了和struts1.3的集成,实现了动态添加和删除。 文档包括: user_mgr.jsp ,jsp页面 UserAction.jsp ,控制层Action js包,相关的js jar使用到的jar包

    jquery插件之flexigrid学习实例-jar包

    在"jquery插件之flexigrid学习实例-jar包"中,我们主要关注的是如何将Flexigrid集成到基于Struts2和JSON的Java应用中。以下是对这个主题的详细讲解: 首先,让我们了解Flexigrid。Flexigrid是一款轻量级的...

    Flexigrid的使用(整合Struts2 )

    Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。 本资源为...

    jquery插件之flexigrid学习实例

    在这个"jquery插件之flexigrid学习实例"中,我们将深入探讨如何在Struts2框架下结合JSON进行数据交互,以实现一个完整的应用。 首先,我们需要了解Flexigrid的基本使用方法。在HTML页面中,我们需要引入jQuery库和...

    flexigrid+struts2+json+jquery实例

    在这个实例中,Flexigrid与Struts2、JSON和jQuery进行了集成,构建了一个功能丰富的Web应用。 Struts2是Apache软件基金会的一个开源MVC框架,用于构建Java Web应用程序。它提供了强大的动作调度、拦截器机制以及...

    SSH整合应用+Jquary+Flexigrid实现表格数据显示

    SSH整合是指将Spring、Struts2和Hibernate这三个Java EE开发中的主流框架进行集成,以便构建高效、可维护的Web应用程序。在这个实例中,SSH整合被用于实现一个数据列表的显示功能,利用了Jquery框架的Flexigrid插件...

    Jquery flexigrid使用

    本文档旨在介绍如何结合Struts2.1.6、Spring、Hibernate、jQuery、Flexigrid、Thickbox及MySQL来实现一个功能完整的Web应用。该应用的核心是通过Flexigrid在前端展示数据,并支持动态分页和数据查询。 #### 关键...

    struts2+spring3+hibernate3+jquery+flexigrid+mysql实例

    Struts2、Spring3、Hibernate3、jQuery、Flexigrid 和 MySQL 是一组常见的技术栈,用于构建企业级的Java Web应用程序。以下是对这些技术及其在实际应用中的详细说明: 1. **Struts2**:Struts2 是一个基于 MVC...

    Flexigrid Demo

    Flexigrid结合Struts1从Mysql数据库中读取数据,并通过Flexigrid插件进行数据的展示,同时实现预览pdf跟图片的功能。 下载完成后请仔细阅读文件中的readme.file。 希望此Demo对刚使用Flexigrid插件的朋友们有所帮助...

    flexigrid在struts2框架中的运用的项目源代码

    主要是实现flexigrid在struts2架构中的增删改查的功能。 部署说明: flexieGridStrut文件夹为源码。 accountant.sql 为数据库代码。 部署步骤: 把flexieGridStrut导入到Myeclipse。 在mysql里面运行accountant....

    Struts1+hibernate+spring+flexigrid+jsmodal 集成

    使用了框架是Struts1+hibernate+spring 集成了JQuery的FlexiGrid表格插件以及 jsmodal弹出框插件 一个增删改列表 数据库使用的是MYSQL 内有建表语句 数据库配置请自行配置本机数据库

    jquery+flexigrid使用方法.pdf

    在这个技术方案中,使用的技术栈包括Struts2.1.6、Spring、Hibernate、jQuery、Flexigrid、Thickbox以及MySQL数据库。Struts2作为MVC框架处理业务逻辑,Spring进行依赖注入和事务管理,Hibernate作为ORM工具简化...

    jquery grid插件 Flexigrid + servlet

    Flexigrid可以与各种前端框架(如Bootstrap)和后端技术(如Spring MVC、Struts2)结合,构建完整的Web应用。通过合理的架构设计,可以使数据流、业务逻辑和视图层更好地解耦,提高代码的可维护性和复用性。 总的来...

    Jqueryflexigrid使用中文WORD版

    使用技术:struts2.1.6 spring hibernate jquery flexigrid thickbox mysql;主要的js文件:jquery.js,flexigrid.js,query.js,thickbox.js,util.js;希望本文档会给有需要 资源太大,传百度网盘了,链接在附件中,有...

    人工智能-机器学习-移动互联网数据分析系统设计与实现.pdf

    此外,系统还利用了JqPlot插件生成美观的报表,Flexigrid插件创建灵活高效的表格,并通过Ajax技术实现页面的异步刷新,提升了用户体验。这些技术的应用使得系统在数据处理和展示方面表现出色。 论文详细阐述了系统...

Global site tag (gtag.js) - Google Analytics