一个表格视图类
很懒只写了一点点,将就成形! 谁有兴趣可以再加些功能进去!应该会很好用的!
<html>
<head>
<title>Test table view class</title>
<script language="javascript" type="text/javascript">
<!--
/*
* className: TableView
*
Args: [in] ArgTableType
String
*
[in] ArgTableName
String
*
[in] ArgParentElement Object
*
[in] ArgShowRecordCount Integer
*
comment:
*/
function TableView(ArgTableType, ArgTableName, ArgParentElement, ArgShowRecordCount)
{
// property
this.iTableType
= ArgTableType;
this.sTableName
= ArgTableName;
this.oParentElement
= ArgParentElement;
this.iShowRecordCount = ArgShowRecordCount;
// object
this.aFileds
= new Array();
this.aRecords
= new Array();
this.aSelRecords
= new Array();
// method
this.addFiled
= TableView_addFiled;
this.delFiled
= TableView_delFiled;
this.addRecord
= TableView_addRecord;
this.delRecord
= TableView_delRecord;
this.updateView
= TableView_updateView;
// event
this.onMouseOver
= TableView_onMouseOver;
this.onMouseOut
= TableView_onMouseOut;
this.onClick
= TableView_onClick;
}
/*
* className: TableView
*
method: addFiled
*
Args: [in] ArgFiledName
String
*
[in] ArgWidth
Integer
*
comment:
*/
function TableView_addFiled(ArgFiledType, ArgFiledName, ArgWidth, ArgAlign)
{
var iTemp;
iTemp
= this.aFileds.length;
this.aFileds[iTemp]
= new Array();
this.aFileds[iTemp]["Type"]
= ArgFiledType;
this.aFileds[iTemp]["Name"]
= ArgFiledName;
this.aFileds[iTemp]["Width"] = ArgWidth;
this.aFileds[iTemp]["Align"] = ArgAlign;
}
/*
* className: TableView
*
method: delFiled
*
Args: [in] ArgFiledName
String
*
comment:
*/
function TableView_delFiled(ArgFiledName)
{
var iIndex;
for (iIndex=0;iIndex<this.aFileds.length;iIndex++)
{
if (this.aFileds[iIndex]["Name"]==ArgFiledName)
{
this.aFileds.splice(iIndex,1);
return(0);
}
}
}
/*
* className: TableView
*
method: addRecord
*
Args: [in] ArgRecord Array
*
comment:
*/
function TableView_addRecord(ArgRecord)
{
var iIndex, iTemp;
iTemp
= this.aRecords.length;
this.aRecords[iTemp] = new Array();
for (iIndex=0;iIndex<this.aFileds.length;iIndex++)
{
this.aRecords[iTemp][this.aFileds[iIndex]["Name"]] = ArgRecord[this.aFileds[iIndex]["Name"]];
}
}
/*
* className: TableView
*
method: delRecord
*
Args: [in] ArgFiledName String
*
[in] ArgValue
String
*
comment:
*/
function TableView_delRecord(ArgFiledName, ArgValue)
{
var iIndex;
for (iIndex=0;iIndex<this.aRecords.length;iIndex++)
{
if (this.aRecords[iIndex][ArgFiledName]==ArgValue)
{
this.aRecords.splice(iIndex,1);
return(0);
}
}
}
/*
* className: TableView
*
method: onMouseOver
*
Args: [in] oTableView class
*
comment:
*/
function TableView_onMouseOver(oTableView)
{
var iIndex;
if (event.srcElement.className=="RecordItem")
{
for (iIndex=0;iIndex<oTableView.aSelRecords.length;iIndex++)
{
if (event.srcElement.parentElement.id==oTableView.aSelRecords[iIndex])
{
return(0);
}
}
event.srcElement.parentElement.style.backgroundColor = "#d9ffff";
}
if (event.srcElement.className=="CmdButton")
{
event.srcElement.style.color = "#ee2200";
}
}
/*
* className: TableView
*
method: onMouseOver
*
Args: [in] oTableView class
*
comment:
*/
function TableView_onMouseOut(oTableView)
{
var iIndex;
if (event.srcElement.className=="RecordItem")
{
for (iIndex=0;iIndex<oTableView.aSelRecords.length;iIndex++)
{
if (event.srcElement.parentElement.id==oTableView.aSelRecords[iIndex])
{
return(0);
}
}
event.srcElement.parentElement.style.backgroundColor = "#ffffff";
}
if (event.srcElement.className=="CmdButton")
{
event.srcElement.style.color = "#0084ff";
}
}
/*
* className: TableView
*
method: onClick
*
Args: [in] oTableView class
*
comment:
*/
function TableView_onClick(oTableView)
{
var iIndex, iJndex;
if (event.srcElement.className=="RecordItem")
{
for (iIndex=0;iIndex<oTableView.aSelRecords.length;iIndex++)
{
if (event.srcElement.parentElement.id==oTableView.aSelRecords[iIndex])
{
oTableView.aSelRecords.splice(iIndex,1);
event.srcElement.parentElement.style.backgroundColor = "#d9ffff";
document.all.LbaSelRecordCount.innerHTML
= " " + oTableView.aSelRecords.length + " ";
return(0);
}
}
oTableView.aSelRecords[oTableView.aSelRecords.length] = event.srcElement.parentElement.id;
event.srcElement.parentElement.style.backgroundColor = "#fff0ff";
document.all.LbaSelRecordCount.innerHTML
= " " + oTableView.aSelRecords.length + " ";
}
if (event.srcElement.className=="CmdButton")
{
switch (event.srcElement.innerText)
{
case "AddRecord":
PopupWindow("AddRecord", null);
break;
case "DelRecord":
if (oTableView.aSelRecords.length>0)
{
for (iIndex=0;iIndex<oTableView.aSelRecords.length;iIndex++)
{
oTableView.delRecord(oTableView.aFileds[0]["Name"], oTableView.aSelRecords[iIndex].substring(17, oTableView.aSelRecords[iIndex].length));
}
oTableView.aSelRecords.splice(0,oTableView.aSelRecords.length);
oTableView.updateView();
}
break;
case "MifRecord":
alert("MifRecord");
break;
case "UpdateToDataBase":
alert("UpdateToDataBase");
}
}
}
/*
* className: TableView
*
method: updateView
*
Args: not
*
comment:
*/
function TableView_updateView()
{
var oTableHead_Div, oSpan, oTableCaption_Div, oTableToolsbar, oTableBody_Div, oTr_Div, oTd_Div;
var iTableWidth, iPrevElementLeft, iIndex, iJndex;
this.oParentElement.innerHTML = "";
if (this.iTableType==0)
{
if (this.aFileds.length>0)
{
// create table head element from element a 'DIV'
iTableWidth=0;
for (iIndex=0;iIndex<this.aFileds.length;iIndex++)
{
iTableWidth+=parseInt(this.aFileds[iIndex]["Width"]);
}
oTableHead_Div
= document.createElement("DIV");
oTableHead_Div.style.position
= "absolute";
oTableHead_Div.style.left
= 0;
oTableHead_Div.style.top
= 0;
if (this.aRecords.length>this.iShowRecordCount)
{
oTableHead_Div.style.width
= iTableWidth + 17 - this.aFileds.length;
}
else
{
oTableHead_Div.style.width
= iTableWidth - this.aFileds.length;
}
oTableHead_Div.style.height
= 50;
oTableHead_Div.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#ffffff,endColorstr=#E2F2FC)";
oTableHead_Div.style.borderStyle = "solid";
oTableHead_Div.style.borderColor = "#75c5f0";
oTableHead_Div.style.borderWidth = 1;
oTableHead_Div.style.textAlign
= "right";
oTableHead_Div.style.verticalAlign = "bottom";
oTableHead_Div.style.paddingTop
= 30;
oTableHead_Div.style.fontSize
= 12;
oTableHead_Div.style.fontFamily
= "Verdana";
oTableHead_Div.style.fontWeight
= "bold";
oSpan
= document.createElement("SPAN");
oSpan.innerText
= "TableName:";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
oSpan
= document.createElement("SPAN");
oSpan.style.color = "#0084ff";
oSpan.innerHTML
= " " + this.sTableName + " ";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
oSpan
= document.createElement("SPAN");
oSpan.innerHTML
= "RecordCount:";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
oSpan
= document.createElement("SPAN");
oSpan.id
= "LbaRecordCount";
oSpan.style.color = "#ff0096";
oSpan.innerHTML
= " " + this.aRecords.length + " ";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
oSpan
= document.createElement("SPAN");
oSpan.innerHTML
= "SelRecordCount:";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
oSpan
= document.createElement("SPAN");
oSpan.id
= "LbaSelRecordCount";
oSpan.style.color = "#ff0096";
oSpan.innerHTML
= " " + this.aSelRecords.length + " ";
oTableHead_Div.appendChild(oSpan);
oSpan
= null;
this.oParentElement.appendChild(oTableHead_Div);
// create table caption element from element a 'DIV'
oTableCaption_Div
= document.createElement("DIV");
oTableCaption_Div.style.position
= "absolute";
oTableCaption_Div.style.left
= 0;
oTableCaption_Div.style.top
= 50;
oTableCaption_Div.style.width
= parseInt(this.aFileds[0]["Width"]);
oTableCaption_Div.style.height
= 25;
oTableCaption_Div.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oTableCaption_Div.style.borderStyle
= "solid";
oTableCaption_Div.style.borderColor
= "#75c5f0";
oTableCaption_Div.style.borderWidth
= 1;
oTableCaption_Div.style.textAlign
= this.aFileds[0]["Align"];
oTableCaption_Div.style.verticalAlign = "middle";
oTableCaption_Div.style.paddingTop
= 3;
oTableCaption_Div.style.paddingLeft
= 5;
oTableCaption_Div.style.paddingRight = 5;
oTableCaption_Div.style.fontSize
= 12;
oTableCaption_Div.style.fontFamily
= "Verdana";
oTableCaption_Div.style.fontWeight
= "bold";
oTableCaption_Div.innerText
= this.aFileds[0]["Name"];
this.oParentElement.appendChild(oTableCaption_Div);
iPrevElementLeft
= 0;
for (iIndex=1;iIndex<this.aFileds.length;iIndex++)
{
iPrevElementLeft
+= parseInt(this.aFileds[iIndex-1]["Width"])-1;
oTableCaption_Div
= document.createElement("DIV");
oTableCaption_Div.style.position
= "absolute";
oTableCaption_Div.style.left
= iPrevElementLeft;
oTableCaption_Div.style.top
= 50;
oTableCaption_Div.style.width
= parseInt(this.aFileds[iIndex]["Width"]);
oTableCaption_Div.style.height
= 25;
oTableCaption_Div.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oTableCaption_Div.style.borderStyle
= "solid";
oTableCaption_Div.style.borderColor
= "#75c5f0";
oTableCaption_Div.style.borderWidth
= 1;
oTableCaption_Div.style.textAlign
= this.aFileds[iIndex]["Align"];
oTableCaption_Div.style.paddingTop
= 3;
oTableCaption_Div.style.paddingLeft
= 5;
oTableCaption_Div.style.paddingRight = 5;
oTableCaption_Div.style.fontSize
= 12;
oTableCaption_Div.style.fontFamily
= "Verdana";
oTableCaption_Div.style.fontWeight
= "bold";
oTableCaption_Div.innerText
= this.aFileds[iIndex]["Name"];
this.oParentElement.appendChild(oTableCaption_Div);
}
if (this.aRecords.length>this.iShowRecordCount)
{
iPrevElementLeft
+= parseInt(this.aFileds[iIndex-1]["Width"])-1;
oTableCaption_Div
= document.createElement("DIV");
oTableCaption_Div.style.position
= "absolute";
oTableCaption_Div.style.left
= iPrevElementLeft;
oTableCaption_Div.style.top
= 50;
oTableCaption_Div.style.width
= 17;
oTableCaption_Div.style.height
= 25;
oTableCaption_Div.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oTableCaption_Div.style.borderStyle
= "solid";
oTableCaption_Div.style.borderColor
= "#75c5f0";
oTableCaption_Div.style.borderWidth
= 1;
this.oParentElement.appendChild(oTableCaption_Div);
}
// create table body element from element a 'DIV'
oTableBody_Div
= document.createElement("DIV");
oTableBody_Div.style.position
= "absolute";
oTableBody_Div.style.left
= 0;
oTableBody_Div.style.top
= 75;
if (this.aRecords.length>this.iShowRecordCount)
{
oTableBody_Div.style.width
= iTableWidth + 17 - this.aFileds.length;
}
else
{
oTableBody_Div.style.width
= iTableWidth - this.aFileds.length;
}
oTableBody_Div.style.height
= parseInt(this.iShowRecordCount * 19)+1;
oTableBody_Div.style.overflowY
= "auto";
// create table record item
for (iJndex=0;iJndex<this.aRecords.length;iJndex++)
{
oTr_Div
= document.createElement("DIV");
oTr_Div.style.position
= "absolute";
oTr_Div.style.left
= 0;
oTr_Div.style.top
= (iJndex * 19);
oTr_Div.style.height
= 20;
oTr_Div.style.backgroundColor = "#ffffff";
oTr_Div.style.width
= iTableWidth - this.aFileds.length;
oTr_Div.style.cursor
= "hand";
oTr_Div.id
= "RecordFirstFiild:" + this.aRecords[iJndex][this.aFileds[0]["Name"]];
oTd_Div
= document.createElement("DIV");
oTd_Div.style.position
= "absolute";
oTd_Div.style.left
= 0;
oTd_Div.style.top
= 0;
oTd_Div.style.height
= 20;
oTd_Div.style.width
= parseInt(this.aFileds[0]["Width"]);
oTd_Div.style.textAlign
= this.aFileds[0]["Align"];
oTd_Div.style.paddingTop
= 2;
oTd_Div.style.paddingLeft
= 5;
oTd_Div.style.paddingRight
= 5;
oTd_Div.style.fontSize
= 12;
oTd_Div.style.fontFamily
= "Verdana";
oTd_Div.style.fontWeight
= "400";
oTd_Div.style.borderStyle
= "solid";
oTd_Div.style.borderColor
= "#bce2f8";
oTd_Div.style.borderWidth
= 1;
oTd_Div.className
= "RecordItem";
oTd_Div.innerText
= this.aRecords[iJndex][this.aFileds[0]["Name"]];
oTr_Div.appendChild(oTd_Div);
iPrevElementLeft
= 0;
for (iIndex=1;iIndex<this.aFileds.length;iIndex++)
{
iPrevElementLeft
+= parseInt(this.aFileds[iIndex-1]["Width"])-1;
oTd_Div
= document.createElement("DIV");
oTd_Div.style.position
= "absolute";
oTd_Div.style.left
= iPrevElementLeft;
oTd_Div.style.top
= 0;
oTd_Div.style.height
= 20;
oTd_Div.style.width
= parseInt(this.aFileds[iIndex]["Width"]);
oTd_Div.style.textAlign
= this.aFileds[iIndex]["Align"];
oTd_Div.style.paddingTop
= 2;
oTd_Div.style.paddingLeft
= 5;
oTd_Div.style.paddingRight
= 5;
oTd_Div.style.fontSize
= 12;
oTd_Div.style.fontFamily
= "Verdana";
oTd_Div.style.fontWeight
= "400";
oTd_Div.style.borderStyle
= "solid";
oTd_Div.style.borderColor
= "#bce2f8";
oTd_Div.style.borderWidth
= 1;
oTd_Div.className
= "RecordItem";
oTd_Div.innerText
= this.aRecords[iJndex][this.aFileds[iIndex]["Name"]];
oTr_Div.appendChild(oTd_Div);
oTd_Div
= null;
}
oTableBody_Div.appendChild(oTr_Div);
}
this.oParentElement.appendChild(oTableBody_Div);
// add table tools bar
oTableToolsbar
= document.createElement("DIV");
oTableToolsbar.style.position
= "absolute";
oTableToolsbar.style.left
= 0;
oTableToolsbar.style.top
= 75 + parseInt(oTableBody_Div.style.left) + parseInt(oTableBody_Div.style.height);
if (this.aRecords.length>this.iShowRecordCount)
{
oTableToolsbar.style.width
= iTableWidth + 17 - this.aFileds.length;
}
else
{
oTableToolsbar.style.width
= iTableWidth - this.aFileds.length;
}
oTableToolsbar.style.height
= 30;
oTableToolsbar.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oTableToolsbar.style.borderStyle = "solid";
oTableToolsbar.style.borderColor = "#75c5f0";
oTableToolsbar.style.borderWidth = 1;
oTableToolsbar.style.textAlign
= "right";
oTableToolsbar.style.paddingTop
= 6;
oTableToolsbar.style.fontSize
= 12;
oTableToolsbar.style.fontFamily
= "Verdana";
oTableToolsbar.style.fontWeight
= "bold";
oTableToolsbar.style.color
= "#bbbbbb";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "AddRecord";
oTableToolsbar.appendChild(oSpan);
oSpan
= null;
oTableToolsbar.innerHTML
+= " | ";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "DelRecord";
oTableToolsbar.appendChild(oSpan);
oSpan
= null;
oTableToolsbar.innerHTML
+= " | ";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "MifRecord";
oTableToolsbar.appendChild(oSpan);
oSpan
= null;
oTableToolsbar.innerHTML
+= " | ";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "UpdateToDataBase";
oTableToolsbar.appendChild(oSpan);
oSpan
= null;
oTableToolsbar.innerHTML
+= " | ";
this.oParentElement.appendChild(oTableToolsbar);
if (this.aRecords.length>this.iShowRecordCount)
{
this.oParentElement.style.width
= iTableWidth + 17;
}
else
{
this.oParentElement.style.width
= iTableWidth;
}
this.oParentElement.style.height
= 75 + parseInt(oTableBody_Div.style.left) + parseInt(oTableBody_Div.style.height) + parseInt(oTableToolsbar.style.height);
}
}
}
function PopupWindow(argTitle, argFileds)
{
var oBaseFrame, oWindowCaption, oWindowBody, oWindowToolBar, oSpan;
// create popup window base frame
oBaseFrame
= document.createElement("DIV");
oBaseFrame.style.position
= "absolute";
oBaseFrame.style.left
= parseInt(document.body.offsetWidth) / 2 - 150;
oBaseFrame.style.top
= parseInt(document.body.offsetHeight) / 2 - 150;
oBaseFrame.style.width
= 300;
oBaseFrame.style.height
= 330;
oBaseFrame.style.borderWidth
= 1;
oBaseFrame.style.borderStyle
= "solid";
oBaseFrame.style.borderColor
= "#aaaaaa";
oBaseFrame.style.backgroundColor = "#ffffff";
// create popup window caption
oWindowCaption
= document.createElement("DIV");
oWindowCaption.style.position
= "absolute";
oWindowCaption.style.left
= 0;
oWindowCaption.style.top
= 0;
oWindowCaption.style.width
= 298;
oWindowCaption.style.height
= 25;
oWindowCaption.style.borderWidth = 1;
oWindowCaption.style.borderStyle = "solid";
oWindowCaption.style.borderColor = "#bce2f8";
oWindowCaption.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oWindowCaption.style.paddingTop
= 3;
oWindowCaption.style.paddingLeft = 5;
oWindowCaption.style.fontSize
= 12;
oWindowCaption.style.fontWeight
= 700;
oWindowCaption.style.fontFamily
= "Verdana";
oWindowCaption.innerText
= argTitle;
oBaseFrame.appendChild(oWindowCaption);
oWindowBody
= document.createElement("DIV");
oWindowBody.style.position
= "absolute";
oWindowBody.style.left
= 0;
oWindowBody.style.top
= 25;
oWindowBody.style.height
= 250;
oBaseFrame.appendChild(oWindowBody);
oWindowToolBar
= document.createElement("DIV");
oWindowToolBar.style.position
= "absolute";
oWindowToolBar.style.left
= 0;
oWindowToolBar.style.top
= 298;
oWindowToolBar.style.width
= 298;
oWindowToolBar.style.height
= 30;
oWindowToolBar.style.borderWidth = 1;
oWindowToolBar.style.borderStyle = "solid";
oWindowToolBar.style.borderColor = "#bce2f8";
oWindowToolBar.style.filter
= "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#cde9fa,endColorstr=#ffffff)";
oWindowToolBar.style.paddingTop
= 6;
oWindowToolBar.style.paddingRight = 5;
oWindowToolBar.style.textAlign
= "right";
oWindowToolBar.style.fontSize
= 12;
oWindowToolBar.style.fontWeight
= 700;
oWindowToolBar.style.fontFamily
= "Verdana";
oWindowToolBar.style.color
= "#bbbbbb";
oBaseFrame.appendChild(oWindowToolBar);
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "Enter";
oWindowToolBar.appendChild(oSpan);
oSpan
= null;
oWindowToolBar.innerHTML
+= " | ";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "Rest";
oWindowToolBar.appendChild(oSpan);
oSpan
= null;
oWindowToolBar.innerHTML
+= " | ";
oSpan
= document.createElement("SPAN");
oSpan.style.color
= "#0084ff";
oSpan.style.textAlign
= "center";
oSpan.style.cursor
= "hand";
oSpan.className
= "CmdButton";
oSpan.innerText
= "Close";
oWindowToolBar.appendChild(oSpan);
oSpan
= null;
oWindowToolBar.innerHTML
+= " | ";
document.body.appendChild(oBaseFrame);
}
/*==================================================================================================================================
*
* Method: main
*
Args: not
*
*/
function main()
{
var oTableView = new TableView(0, "RenInfoTable", oFrame, 15);
var newRecord = new Array();
document.body.onmouseover
= function()
{
oTableView.onMouseOver(oTableView);
};
document.body.onmouseout
= function()
{
oTableView.onMouseOut(oTableView);
};
document.body.onclick
= function()
{
oTableView.onClick(oTableView);
};
//
// add filed to table view.
oTableView.addFiled("TEXT", "SerialNo", 80, "right");
oTableView.addFiled("TEXT", "ClassName", 120, "left");
oTableView.addFiled("TEXTDOC", "Commment", 450, "left");
newRecord["SerialNo"] = "1";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "2";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "3";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "4";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "5";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "6";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "7";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "8";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "9";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "10";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "11";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "12";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "13";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "14";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "15";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "16";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "17";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "18";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "19";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "20";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "21";
newRecord["ClassName"] = "Weipengyuan";
newRecord["Commment"] = "Nan";
oTableView.addRecord(newRecord);
newRecord["SerialNo"] = "22";
newRecord["ClassName"] = "YuRui";
newRecord["Commment"] = "Ni";
oTableView.addRecord(newRecord);
oTableView.updateView();
window.onresize();
}
window.onload = main;
window.onresize = function(){
document.all.oFrame.style.left = parseInt(document.body.offsetWidth) / 2 - parseInt(document.all.oFrame.style.width) / 2;
document.all.oFrame.style.top = parseInt(document.body.offsetHeight) / 2 - parseInt(document.all.oFrame.style.height) / 2;
};
-->
</script>
</head>
<body>
<div id="oFrame" style="position:absolute; left:0; top:0;">
</div>
</body>
</html>