table中点击表头实现排序的功能示例介绍

<a href="javascript:setOrder();">表头名字</a>,页面中获取上次点击的表头的名称和这次点击的表头的名称做比较,如果两者相同就按原先相反的顺序排列,否则新列升序排列,

获取排列顺序的列名及排列顺序以后,传到后台获取相应sql,添加order by 语句,完成排序功能

排序顺序值可在form中存放在隐藏域中,思路就是这样。

例如在使用Birt报表工具创建报表需要点击表头的名称排序的功能时,可以再表头名称处增加一个超链接,链接内容为TargetURL+表头名称 ,然后在初始化方法initialize()中判断原有的表头名称是否和传入的表头名称相同以判断升序和降序,然后获取sql,添加排序语句,完成功能。以下是我做的报表的一个实例。


代码如下:

dataSetName = "fundcatagoryseasontemplate";
sortCol = reportContext.getHttpServletRequest().getParameter("sortCol");//获取需要排序的列名
sortDir = reportContext.getHttpServletRequest().getParameter("sortDir");//获取排列顺序
currentURL = reportContext.getHttpServletRequest().getRequestURL()+"?"+reportContext.getHttpServletRequest().getQueryString();
sortClause = "";
targetURL = "";

if(sortDir != null){
if(sortDir.indexOf("ASC") != -1){
sortDir = "DESC";
}else{
sortDir = "ASC";
}
}else{
sortDir = "ASC";
}

if(sortCol != null && sortCol.length != 0){
sortClause = " order by " + sortCol + " " + sortDir;
}

reportContext.getReportRunnable().getDesignInstance().getDataSet(dataSetName).queryText += sortClause; //获取并修改底层sql语句

if(currentURL.indexOf("__sorting=") != -1 ){
targetURL = currentURL.substring(0,currentURL.indexOf("__sorting")-1 );
}else{
targetURL = currentURL;
}

targetURL = targetURL + "&__sorting=true&sortDir="+sortDir+"&sortCol=";//修改url

(0)

相关推荐

  • table中点击表头实现排序的功能示例介绍

    <a href="javascript:setOrder();">表头名字</a>,页面中获取上次点击的表头的名称和这次点击的表头的名称做比较,如果两者相同就按原先相反的顺序排列,否则新列升序排列, 获取排列顺序的列名及排列顺序以后,传到后台获取相应sql,添加order by 语句,完成排序功能 排序顺序值可在form中存放在隐藏域中,思路就是这样. 例如在使用Birt报表工具创建报表需要点击表头的名称排序的功能时,可以再表头名称处增加一个超链接,链接内容为T

  • Vue 固定头 固定列 点击表头可排序的表格组件

    原理是将原table的指定行,指定列clone一份放在其上 实现代码如下: <template> <div> <div id="divBox1" :style="{height:height}"> <table id="tbTest1" cellpadding="0" cellspacing="0" style="text-align:center;bac

  • jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例

    本文实例讲述了jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能.分享给大家供大家参考,具体如下: 弹出层:两种方式 一是打开网页就自动弹出层 二是点击弹出 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="htt

  • 微信小程序webview实现长按点击识别二维码功能示例

    本文实例讲述了微信小程序webview实现长按点击识别二维码功能.分享给大家供大家参考,具体如下: 场景:微信小程序,使用webview控件.需求:点击图片后长按图片出现"识别二维码" 1.JS代码: <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> <script type="text/javascript"> $(fu

  • jQuery实现的点击图片居中放大缩小功能示例

    本文实例讲述了jQuery实现的点击图片居中放大缩小功能.分享给大家供大家参考,具体如下: 该功能是基于jquery实现的,所以 第一步则是引入jquery jquery下载地址:https://jquery.com/download/ 或者使用此时调试的版本(3版本) jQuery3.2.1文件点击此处本站下载. 第二步:准备HTML文件 <div id="outerdiv" class="wrap"> <div id="innerdi

  • jQuery实现为table表格动态添加或删除tr功能示例

    本文实例讲述了jQuery实现为table表格动态添加或删除tr功能.分享给大家供大家参考,具体如下: HTML页面元素如下: <!-- 订单明细dialog --> <div id="contractDetailDiv" title="销售订单明细" style="display:none;"> <table class="exhibit_table" id="contractDeta

  • jQuery实现table表格信息的展开和缩小功能示例

    本文实例讲述了jQuery实现table表格信息的展开和缩小功能.分享给大家供大家参考,具体如下: <%@ page language="java"import="java.util.*"pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+re

  • 易语言超级列表框点击表头进行排序的代码

    超级列表框排序模块源码 .版本 2 .支持库 iext .程序集 程序集1 .子程序 _启动子程序, 整数型, , 请在本子程序中放置易模块初始化代码 _临时子程序 () ' 在初始化代码执行完毕后调用测试代码 返回 (0) ' 可以根据您的需要返回任意数值 .子程序 _临时子程序 ' 本名称子程序用作测试程序用,仅在开发及调试环境中有效,编译发布程序前将被系统自动清空,请将所有用作测试的临时代码放在本子程序中. 注意不要修改本子程序的名称.参数及返回值类型. .子程序 超级列表框排序, 整数型

  • element-ui直接在表格中点击单元格编辑

    目录 实现效果 实现代码 最近由于公司开始使用elementUI,开发的过程中需要用到对表格的单元格进行编辑,下面是我自己实现表格可编辑的方式,感兴趣的可以了解一下 实现效果 编辑之后对应表格数据该字段值也就发生了变化,控制台输出所有数据即可查看变化 实现代码 1.自定义编辑组件 <template> <div class="editCell"> <div class="canEdit" v-if="CanEdit"

  • JS实现的点击表头排序功能示例

    本文实例讲述了JS实现的点击表头排序功能.分享给大家供大家参考,具体如下: 运行效果: 1.index.html文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>jb51.net点击表头排序</t

随机推荐