最近使用flexigrid的时候遇到一个问题:在grid中选中一条记录后跳转到其他页面进行操作(比如说编辑数据),之后再回到grid页面时,希望能够回到操作之前所停留的页数,即要“记住当前分页”。
当前页数的保存可以通过session之类的手段实现,但问题的关键点在于如何手动设定flexigrid的起始页。一开始我根据网上广泛流传的那一份flexigrid参数说明,以为是设置page参数,但结果不起作用。经过查看flexigrid的源代码后才发现,要设置的不是page,而是newp,最后的实现实现方案如下(由于写的时候比较随意,就在jsp上直接写了java代码了,):
$("#flex1").flexigrid({
//......
newp: <% Object p = request.getSession().getAttribute("currentPage");
if(null != p){
out.print(p.toString());
}else{
out.print(1);
}
%>,
//......
});
那么,为什么是newp,而不是page呢?通过查看flexigrid的源代码就很容易地发现原因:
populate: function () { //get latest data
//......
var param = [
{ name : 'page', value : p.newp }
,{ name : 'rp', value : p.rp }
,{ name : 'sortname', value : p.sortname}
,{ name : 'sortorder', value : p.sortorder }
,{ name : 'query', value : p.query}
,{ name : 'qtype', value : p.qtype}
];
if (p.params){
for (var pi = 0; pi < p.params.length; pi++) param[param.length] = p.params[pi];
}
$.ajax({
type: p.method,
url: p.url,
data: param,
dataType: p.dataType,
success: function(data){g.addData(data);},
error: function(data) { try { if (p.onError) p.onError(data); } catch (e) {} }
});
},
注意第6行,flexigrid在初始化时,默认是把newp参数赋值给ajax请求的参数page的,而grid的page参数,其实仅用于显示当前页码,并不作为请求参数传递到后台。
分享到:
相关推荐
总的来说,Gdftable是一个基于jQuery的表格组件,它模仿了Flexigrid的功能,如自定义样式、无限滚动加载和表头按钮,并且允许用户在需要时停止滚动加载。对于那些希望在项目中使用类似Flexigrid功能但又希望有所差异...
4. **API接口**:Flexigrid.js提供了一系列API,允许开发者控制表格行为,如初始化、重新加载数据、改变列宽、排序等,使得扩展和定制变得容易。 5. **CSS样式**:通过CSS,开发者可以自定义网格的外观,包括字体、...
这里,`url`指定了获取数据的服务器端接口,`dataType`指定返回数据的类型,`colModel`定义了表格列的显示方式和行为,`buttons`定义了操作按钮及其响应的回调函数,`searchitems`则用于设置搜索栏的字段。...
开发者可以通过设置各种参数,如colModel定义列的属性,params设置请求参数,以及url指定数据来源,实现数据的加载和操作。 标签“jquery”表明这是关于JavaScript库jQuery的知识,而“flexigrid”则强调了我们讨论...
3. JavaScript配置:在文档加载完成后,使用jQuery选择器找到表格,并调用`.flexigrid()`方法进行初始化。你可以传递参数来定制网格的行为,如宽度、高度、列定义等。例如: ```javascript $("#flex1").flexigrid({ ...
它允许开发者将表格数据与后台数据库紧密连接,通过Ajax实现动态加载,减少了页面刷新,提升了用户体验。表格中的每一列都可以独立设置排序方式,用户只需点击列头,即可实现升序或降序排列。同时,Flexigrid内置了...
在“flexigrid.js”和“flexigrid.css”这两个核心文件中,JavaScript文件主要负责实现数据的动态加载和交互功能,而CSS文件则用于定义插件的样式,以确保其在页面上的美观呈现。 `jquery+flexigrid使用方法.doc`...
Flexigrid demo
3. **分页**:Flexigrid内置了分页功能,能够有效地管理大量数据,避免一次性加载过多内容导致页面响应变慢。用户可以通过设置每页显示的行数以及导航按钮,轻松浏览表格的各个部分。 4. **排序**:对于表格中的...
Flexigrid是一款基于jQuery的强大的表格插件,它提供了丰富的功能和灵活的配置选项,使得在Web应用中创建和管理表格变得更为简单。在“flexigrid表格功能丰富”这一主题下,我们可以深入探讨Flexigrid的核心特性以及...
前端的Flexigrid插件接收到JSON数据后,会自动填充到表格中,实现数据的动态加载和展示。 对于标签中的其他技术,JavaScript是Flexigrid的基础,用于处理用户交互和DOM操作;jQuery简化了跨浏览器的JavaScript编程...
- **分页**:FlexiGrid支持分页,可以将大量数据分割成小块,以提高加载速度和用户体验。 - **排序**:用户可以通过点击列头对数据进行升序或降序排序,方便查找和比较信息。 - **过滤**:允许用户根据特定条件...
- 数据绑定:通过AJAX请求获取服务器端数据,然后调用Flexigrid的load方法加载数据。 3. **API和自定义选项** - API:Flexigrig提供了一系列的API方法,如reload(重新加载数据)、setColModel(设置列模型)、...
5. **异步数据加载**:Flexigrid支持AJAX方式获取数据,可以与后端服务器进行交互,实现分页、排序、过滤等功能。这通常涉及到HTTP请求的GET或POST方法,以及处理JSON或XML格式的响应数据。 6. **功能扩展**:...
FlexiGrid是一个基于jQuery的网格组件,用于展示和操作数据,具有丰富的特性和自定义功能。这个使用手册将详细介绍如何使用FlexiGrid以及其主要属性。 一、FlexiGrid概述 FlexiGrid是一个轻量级的JavaScript插件,...
Flexigrid支持从服务器获取数据,通过`url`参数指定API接口。在服务器端,你需要返回符合配置的数据格式,通常是JSON或XML。例如,JSON数据可能如下: ```json { "total": 100, // 总记录数 "rows": [ // 数据...
Flexigrid是一款基于jQuery的表格插件,它提供了丰富的功能,如数据分页、排序、搜索和自定义列宽等,极大地增强了网页中表格的展示效果和交互性。在"jquery插件之flexigrid学习实例-jar包"中,我们主要关注的是如何...
### jsp中flexigrid插件在IE下的样式问题解析 #### 一、问题背景与概述 在Web开发中,FlexiGrid是一个非常流行的jQuery表格插件,它可以帮助开发者快速地构建具有高度自定义功能的数据表格。然而,在使用FlexiGrid...
2. **分页**:FlexiGrid支持分页,用户可以设置每页显示的数据数量,以及导航到不同页面。在Servlet中,我们需要处理请求,计算总页数,并返回当前页的数据。 3. **排序**:FlexiGrid允许用户对表格的列进行排序,...
当页面加载或特定事件触发时,Flexigrid会发送AJAX请求到指定的URL获取数据,并在表格中展示。 总的来说,这个实例展示了SSH框架如何与Jquery的Flexigrid插件配合,实现一个简单的数据列表展示功能。SSH框架的集成...