搜索
首页数据库mysql教程APEX 3.2上Interactive Report 的表头复制(1)(APEX4.1下运行通

最近为公司一个部门写了一个APEX应用。 他们要把Excle上的100多栏(太宽?)的表显示在APEX的Interactive Report上。 还不止这些,每页要显示的记录行数也要尽量多,250行(太长?)。 这样实现并不难,但有个问题,用户在看数据时,表头经常跑到画面外。身

最近为公司一个部门写了一个APEX应用。

他们要把Excle上的100多栏(太宽?)的表显示在APEX的Interactive Report上。

还不止这些,每页要显示的记录行数也要尽量多,250行(太长?)。

这样实现并不难,但有个问题,用户在看数据时,表头经常跑到画面外。身首异地,很不方便。

 

能像Excel那样,将画面分割表示当然好,可惜不能。于是就想出了复制表头信息,将其插入需要的地方这一笨招。

 其实也简单,在需要的地方双击(DoubleClick),复制表头(下表中以红色示意的部分)。

按(x)可消去复制的表头;按(+)可将该行数据纵向显示,如果用IE,还可以拷贝到Clipboard。

ABC DEF GHI JKL ..... ... ... XYZ ... ...
123 456 789 012 .... ... ... 999 ... ...
... ... ... ... ... ... ... ... ... ...
... ... ... ... ... ... ... ... ... ...
(双 击插 头)          
ABC DEF GHI JKL ... ... ... XYX ... ...
987 123 445 768 .. ... .. 765 ... ...
... ... ... ... ... ... ... ... ... ...
                   
                   
ABC
DEF GHI JKL ..... ... ... XYZ ... ...
123 456 789 012 .... ... ... 999 ... ...
... ... ... ... ... ... ... ... ... ...
... ... ... ... ... ... ... ... ... ...
(双 击插 头)          
ABC DEF GHI JKL ... ... ... XYX ... ...
987 123 445 768 .. ... .. 765 ... ...
... ... ... ... ... ... ... ... ... ...
                   
                   

Screenshot:

APEX 3.2上Interactive Report 的表头复制(1)(APEX4.1下运行通

Javascript code:

// **************************************
// Name: f104_insertheader.js
// Created by Cho for APEX IR. 2011/11/20
// Added 1st line (Table Header) when double clicked.
// Tested OK under IE v7.0 and FF v8.0
//***************************************

/************ Put following line(s) in IR Region Header HTML ******************

*******************************************************************************/

/************ Put following line(s) in IR Region Footer HTML/Script ************





// 2011/11/17... 工作版本。由曹。通过双击插入标题。

var box = document.getElementById('scrollBox');
var boxContents = document.getElementById('scrollBoxContents');
var lineClickedB4 = 0; // 记住之前点击过哪一行
//-->
脚本>
****************************************************** ******************************/


函数copy2Clipboard(s){
 if( window.clipboardData && ClipboardData.setData ){
          var tmpS =    s.replace(/r?n/g,'');
          tmpS     = tmpS.replace(//gi,'t').replace(//gi,'rn');
          tmpS     = tmpS.replace(/<.>/gi,'');
          ClipboardData.setData("Text", tmpS);
          //alert('已复制到剪贴板。请检查。');
          $x('boxMessage').innerHTML = '[x] 复制完成。';
 }
 其他{
          //alert('抱歉,该浏览器不支持“复制到剪贴板”。');
          $x('boxMessage').innerHTML = '[x] 抱歉,浏览器不支持此功能。';
        }
        $x('boxMessage').style.visibility='visible';
}

函数 moveTo(e) {
  //varscrollBox = document.getElementById('scrollBox');
  if(box.style.visibility  == '可见'){
  //警报(docX(e));警报(docY(e));
  //box.style.top = docY(e);
  //box.style.left = docX(e);

  box.style.top = docY(e) + "px"; //20120911,针对firefox进行修改

  box.style.left = docX(e) + "px"; //20120911,针对firefox进行修改

  }
}


函数框可见性(flg){
  //flg = 可见 ||隐藏
  //警报(flg);
  //varscrollBox = document.getElementById('scrollBox');
  box.style.visibility = flg;
  $x('boxMessage').style.visibility='隐藏'; //如果可见则隐藏[复制到剪贴板]消息框
}

// 在文档网络中获取 (x,y) 的函数。同时支持 IE 和 FF。
函数 docX(e) {return e.pageX || e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;}
函数 docY(e) {return e.pageY || e.clientY + document.body.scrollTop + document.documentElement.scrollTop ;}

函数 plusClicked(e){
    var tgt;
    if (document.all){tgt = e.srcElement;} //对于 IE
       else{tgt = e.target;} //对于 FireFox
    var lineClicked = tgt.parentNode.parentNode.rowIndex+1;
    //alert(lineClicked+'     if (lineClickedB4 != lineClicked){
       lineClickedB4 = lineClicked;
       var table = document.getElementById(gTable);
       makeScrollBox(table, 0, lineClicked);
    }
    boxVisibility('可见');
   // moveTo(事件);

   moveTo(e);  //20120911,针对firefox修改
}

函数insertHeader2Click(e){
    var tgt;
    if (document.all){tgt = e.srcElement;} //对于 IE
       else{tgt = e.target;} //对于 FireFox
    var lineClicked = tgt.parentNode.rowIndex;
    var table = document.getElementById(gTable);
    if (lineClicked>0){
       boxVisibility('隐藏'); //创建newHeader
时隐藏scrollBox        行点击B4 = 0;       //重置为0以防止混淆。
       newHeader(表, 0, lineClicked);
    }
}

函数 makeScrollBox(table, hdLine, bdLine){
if (hdLine if (bdLine   //var tbody = table.tBodies[0]; // 使用 tbody

var header = table.getElementsByTagName('tr')[hdLine];
var contnt = table.getElementsByTagName('tr')[bdLine];
var hdCols = header.getElementsByTagName('th');
var ctCols = contnt.getElementsByTagName('td');

boxContents.innerHTML = ''; // 初始化内容块(

).

        // 获取正文的引用
        //var body = document.getElementsByTagName("body")[0];

        // 创建一个;元素和

元素
        var tbl     = document.createElement("table");
        var tblBody = document.createElement("tbody");

        // 创建所有单元格
        //for (var j = 0; j             // 创建一个表行
            //var row = document.createElement("tr");

            for (var i = 0; i                 var row = document.createElement("tr");
                // 创建一个元素和文本节点,使文本
                // 节点 的内容,并将 放入在
                // 表行末尾
                var cell     = document.createElement("td");
                var cellText = document.createTextNode(hdCols[i].innerHTML.replace(/<.>/gi,'').replace(/&.*?;/,''));
                cell.appendChild(cellText);
                row.appendChild(单元格);

                var cell     = document.createElement("td");
                var cellText = document.createTextNode(ctCols[i].innerHTML.replace(/<.>/gi,'').replace(/&.*?;/,''));
                cell.appendChild(cellText);
                row.appendChild(单元格);

                tblBody.appendChild(row);
            }

            // 将行添加到表体末尾
            //tblBody.appendChild(row);
        //}

        // 将

放入在
中         tbl.appendChild(tblBody);
        // 追加 ;进入
        //body.appendChild(tbl);
        boxContents.appendChild(tbl);
        // 设置tbl的border属性为2;
        tbl.setAttribute("border","1px");
}

function newHeader(table, from, to){
//alert(from+'-->'+to);

如果(到 if (from   var tbody = table.tBodies[0]; // 使用 tbody
  //var trFrom = tbody.rows[from]; // 确保行保持被引用
  //tbody.removeChild(trFrom); // 在插入之前删除该行(重复的 id's
  var trTo = tbody.rows[to];

  //var trClone = tbody.rows[from].cloneNode(true); // 也复制子项
  
  //trClone = newHeader();
  //tbody.insertBefore(trClone, trTo);

//alert(trClone.innerHTML);

//var table = document.getElementById(gTable);
  var header = table.getElementsByTagName('tr')[0];
  var cols = header.getElementsByTagName('th');
//alert(header.innerHTML);

  var newHeader = document.createElement('tr'); // 创建行节点

  for (i=0;i //alert(cols[i].getElementsByTagName('div')[0].id);

     col = document.createElement('th'); // 创建列节点
    

//alert(cols[i].innerHTML);

开关 (i){
  案例 0:
    col.innerHTML = cols[i].innerHTML; // 编辑链接列
    休息;
    默认值:
        if (to==1){col.innerHTML='';}
        else{col.innerHTML = cols[i].innerHTML.replace(/onclick=.*?>/gi,'onclick=goHome(event);gReport.controls.widget(this.id)>');}
        col.innerHTML = col.innerHTML + 'x';
        col.innerHTML = col.innerHTML + '     ';
        col.innerHTML = col.innerHTML + '+';

    休息;
}
     newHeader.appendChild(col); // 将一列附加到行
  }

tbody.insertBefore(newHeader, trTo); // 在 trTo
之前插入 newHeader 返回新标题;
}

函数removeHeader(tgtObj){
//alert(tgtObj.parentNode.parentNode.tagName);

  var lineClicked = tgtObj.parentNode.parentNode.rowIndex;
 if (lineClicked>0){
  var table = document.getElementById(gTable);
  table.deleteRow(lineClicked);
 }
}

函数 goHome(e){
  //alert('回家......');
  //window.scrollTo(0, 0);  // 滚动到位置(x,y)
  //警报(docY(e));
  window.scrollBy(0,-e.pageY||-99999999); // 水平和垂直滚动增量。 IE 速度慢....
  //window.scrollBy(0,-9999999999);
}

 

 

 

 

 

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
如何使用Alter Table语句在MySQL中更改表?如何使用Alter Table语句在MySQL中更改表?Mar 19, 2025 pm 03:51 PM

本文讨论了使用MySQL的Alter Table语句修改表,包括添加/删除列,重命名表/列以及更改列数据类型。

如何为MySQL连接配置SSL/TLS加密?如何为MySQL连接配置SSL/TLS加密?Mar 18, 2025 pm 12:01 PM

文章讨论了为MySQL配置SSL/TLS加密,包括证书生成和验证。主要问题是使用自签名证书的安全含义。[角色计数:159]

您如何处理MySQL中的大型数据集?您如何处理MySQL中的大型数据集?Mar 21, 2025 pm 12:15 PM

文章讨论了处理MySQL中大型数据集的策略,包括分区,碎片,索引和查询优化。

哪些流行的MySQL GUI工具(例如MySQL Workbench,PhpMyAdmin)是什么?哪些流行的MySQL GUI工具(例如MySQL Workbench,PhpMyAdmin)是什么?Mar 21, 2025 pm 06:28 PM

文章讨论了流行的MySQL GUI工具,例如MySQL Workbench和PhpMyAdmin,比较了它们对初学者和高级用户的功能和适合性。[159个字符]

如何使用Drop Table语句将表放入MySQL中?如何使用Drop Table语句将表放入MySQL中?Mar 19, 2025 pm 03:52 PM

本文讨论了使用Drop Table语句在MySQL中放下表,并强调了预防措施和风险。它强调,没有备份,该动作是不可逆转的,详细介绍了恢复方法和潜在的生产环境危害。

如何在JSON列上创建索引?如何在JSON列上创建索引?Mar 21, 2025 pm 12:13 PM

本文讨论了在PostgreSQL,MySQL和MongoDB等各个数据库中的JSON列上创建索引,以增强查询性能。它解释了索引特定的JSON路径的语法和好处,并列出了支持的数据库系统。

您如何用外国钥匙代表关系?您如何用外国钥匙代表关系?Mar 19, 2025 pm 03:48 PM

文章讨论了使用外国密钥来代表数据库中的关系,重点是最佳实践,数据完整性和避免的常见陷阱。

如何保护MySQL免受常见漏洞(SQL注入,蛮力攻击)?如何保护MySQL免受常见漏洞(SQL注入,蛮力攻击)?Mar 18, 2025 pm 12:00 PM

文章讨论了使用准备好的语句,输入验证和强密码策略确保针对SQL注入和蛮力攻击的MySQL。(159个字符)

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )专业的PHP集成开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

EditPlus 中文破解版

EditPlus 中文破解版

体积小,语法高亮,不支持代码提示功能

mPDF

mPDF

mPDF是一个PHP库,可以从UTF-8编码的HTML生成PDF文件。原作者Ian Back编写mPDF以从他的网站上“即时”输出PDF文件,并处理不同的语言。与原始脚本如HTML2FPDF相比,它的速度较慢,并且在使用Unicode字体时生成的文件较大,但支持CSS样式等,并进行了大量增强。支持几乎所有语言,包括RTL(阿拉伯语和希伯来语)和CJK(中日韩)。支持嵌套的块级元素(如P、DIV),