APP下载

B/S模式下数据全屏编辑及批量复制粘贴的实现方法

2017-09-17吴志泉

科学与财富 2017年25期
关键词:复制粘贴

吴志泉

摘要:本文详细阐述了在B/S模式下如何实现数据的全屏编辑及如何通过复制-粘贴模式实现数据的批量录入方法。该方法在作者以asp.net为编程语言,以Oracle为后台数据库的设计的《水井分层测试系统》中得到具体应用,取得了良好的效果。

关键词:Asp.net;Oracle;全屏编辑;复制-粘贴

1.引言

随着信息化的不断深入,企业内部依托局域网,以B/S模式开发的应用系统逐渐成为主流,但多数据应用系统在进行数据编辑时都是逐条进行的,即编辑完一条数据后,按提交按钮,再继续编辑下一条。在很多时候用户在录入数据时都需要多条录入一次提交,这样不仅方便对数据进行检查,也能提高数据库的编辑速度,同时用户还提出要能通过复制-粘贴模式进行数据的编辑。作者通过数据数据回调及隐含域等方法实现了数据的全屏及复制-粘贴模式实现了数据的批量编辑。

2.设计原理

B/S模式的开发人员都知道,通过web模式录入数据,在进行数据提交时,都要进行网页的刷新,刷新之后,动态录入的数据基本上都会被清除掉。虽然现在有了Ajax技術,但其实质仍然是通过局部刷新网页来提交数据。在刷新后系统设计时生成的控件内的数据通过数据回调仍然显示在控件上,但动态添加的控件及其里面的数据都会被清除掉。利用隐含域及数据回调技术,在网页进行刷新时,把动态控件及其里面的内容写到隐含域中,页面刷新后再根据隐含域的内容在页面上进行控件的重画及把原来的数据写到重画后的控件中,然后通过控制光标键在控件内的跳转,来实现类似于Excel方式的全屏编辑。通过javascript的剪贴板读取函数把里面的数据读出来,按格式进行拆分,把拆分后的数据填充到页面数据编辑框控件中。

3.设计思路

3.1全屏编辑

通过添加行按钮,在页面上新添加一行或多行数据编辑框,通过javascript函数↑、↓、回车键、Ctrl键控制光标在编辑框内跳转,↑跳转到上一个编辑框,↓跳转到下一个编辑框,回车键跳转到后一个编辑框,Ctrl跳转到前一个编辑框。

3.2复制-粘贴

由于复制-粘贴是在客户端进行的,我们可以用JavaScript的ClipboardData.getData函数来读取剪贴板内的数据,然后把读取的数据根据数据编辑框的个数和行数,拆分成数组分别填充到数据编辑框中。

3.3数据提交

由于asp.net在进行数据提交时,只提交系统设计时生成的控件及其内容,动态添加的控件不会被提交,因此在进行数据提交时,先通过javascript把客户端动态生成的控件及内容写到设计时生成的隐含控件(隐含域)中,然后再服务器端对隐含域的内容进行解析,再把解析后的结果保存到数据库中。

4.程序实现方法

复制-粘贴程序片断

function WriteDatatoTable(curTable,iSource)

{

var iSourceData;

if (iSource==0)

iSourceData = window.clipboardData.getData('text');

if (iSource==1)

iSourceData=document.getElementById("ClipboardText").value;

if (!iSourceData)

{

document.getElementById("TipLabel").innerHTML="没有符合条件的数据";

return;

}

else

{

document.getElementById("TipLabel").innerHTML="";

}

var curArray=iSourceData.split("\n");

AddTableRow(curTable,curArray.length-1);

var TableCellCount=curTable.rows.item(0).cells.length;

var curSubArray=curArray[0].split("\t");

if (curSubArray.length>TableCellCount-1)

{

document.getElementById("TipLabel").innerHTML="数据列数大于表格列数";

return;

}

for (var i=0;i

{

var curSubArray=curArray[i].split("\t");

for (var j=0;j

{

curTable.rows[i+curTable.rows.length-curArray.length+1].cells[j+1].innerHTML=curSubArray[j];

}

}}

5.结束语

本程序设计方法,已经成功地应用于由作者开发设计的《水井分层测试系统》中,以B/S模式实现了C/S的数据编辑方法。

猜你喜欢

复制粘贴
帖脸谱
《猫头鹰》小粘贴
A ski trip to Japan
What Would I Change It To
一种协同工作环境中(分布式)的容错和安全数据存储方法