生成一个可以编辑的表格,并可以动态地添加行
2008-02-18 10:58
519 查看
<html>
<head>
<script type="text/javascript">
function access()
{
document.getElementById('Append').accessKey="a"
document.getElementById('Confirm').accessKey="c"
document.getElementById('DelAll').accessKey="d"
document.getElementById('DelLst').accessKey="f"
}
</script>
</head>
Gu Laicheng, 2008.2.16<BR/>
生成一个可以编辑的表格,并可以动态地添加行,每次添加的行数可以控制,目前是MaxNumber=20.:<BR/>
可以和已有的明细纪录一起编辑.已有的明细纪录的序号为粗体字。<BR/>
注意:< div id=T4>< /div> 要放在FORM中.<BR/>
字符串有长度约束；数据型有合法性验证；日期型有合法性验证。<BR/>
输入年龄，自动计算出生日期；输入出生日期，自动计算年龄。<BR/>
回车符等同TAB制表符.<BR/>
有alt+快捷键功能，特别是，在按下alt+a时，焦点自动转到第一列的输入域中，以方便操作。<BR/>
提交后，可以获得表格中的数据，并生成insert语句 .
<style>
input
{
BORDER-LEFT: #FFFFFF 1px solid;
BORDER-TOP: #FFFFFF 1px solid;
BORDER-RIGHT: #FFFFFF 1px solid;
BORDER-BOTTOM: #FFFFFF 1px solid
PADDING-RIGHT: 0px;
PADDING-LEFT: 1px;
FONT-SIZE: 1em;
PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle;
PADDING-TOP: 2px;
}
.delbutton
{
font-family: Wingdings;
cursor: hand;
}
</style>
<body onload="access()">
<FORM name=FormAdd method=post>
<div id=T4></div>
<INPUT class='bt' type='button' onclick='InsertRoomNoType(RoomNumberTypeDetail);' value='增加详细(a)' name='Append'>
<INPUT class='bt' type='button' onclick='Confirm0();' value='确认(c)' name='Confirm'>
<INPUT class='bt' type='button' onclick='DeleteAllTr(1);' value='删除全部(d)' name='DelAll'>
<INPUT class='bt' type='button' onclick='DelLowLine(0);' value='删除最后一行(f)' name='DelLst'>
</FORM>
<SCRIPT language=javascript>
//全局ja变量
var MaxNumber=20 //一次可以最多增加的房量详细信息
var AddHowRecord=0 //当前加了几个了
//删除指定表格下拉框所选中的行
function DeleteTr(o,f)
{
var delrow = o.parentNode.parentNode.rowIndex;
if (f && !confirm("您确信要删除此行["+delrow+"]明细信息吗?")) return;
RoomNumberTypeDetail.deleteRow(delrow);
AddHowRecord--;
var ttl=RoomNumberTypeDetail.rows.length;
for(var i=delrow; i<ttl; i++)
{
RoomNumberTypeDetail.rows[i].cells[0].innerText = i;
}
}
//删除全部的行
function DeleteAllTr(f)
{
if (f && !confirm("您确信要删除全部行明细信息吗?")) return;
var ttl = RoomNumberTypeDetail.rows.length;
for(var i=1; i<ttl; i++)
{
RoomNumberTypeDetail.deleteRow(1); //由于是动态表格,这里是1,而不是i
AddHowRecord--;
}
}
//删除最后一行
function DelLowLine(f)
{
if (f && !confirm("您确信要删除最后一行明细信息吗?")) return;
var ttl = RoomNumberTypeDetail.rows.length;
if (ttl==1) return;
RoomNumberTypeDetail.deleteRow(ttl-1);
AddHowRecord--;
}
//说明:通过js插入房量详细信息显示
//参数:要插入表格的ID值
function InsertRoomNoType(tab)
{
if (AddHowRecord>=MaxNumber)
{
alert("每次最多只能增加"+MaxNumber+"条明细.如要增加更多,请先保存后再增加!");
return false;
}
var i=RoomNumberTypeDetail.rows.length;
var TrId="";
AddHowRecord++;
tr=tab.insertRow();
TrId="TrId" + tab.rows.length;
tr.id = TrId;
tr.align="center";
if (!(i&1)) tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7DDE7";
else tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7E7DD";
tr.onmouseover=function()
{
this.style.backgroundColor ="#AAAAFF";
grow = this.rowIndex+1; //TH
}
tr.onmouseout=function()
{
if (grow&1) this.style.backgroundColor="#E7DDE7";
else this.style.backgroundColor="#E7E7DD";
}
td = tr.insertCell(0);
td.innerHTML=i;
tr.insertCell(1).innerHTML="<input name=F001 maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(2).innerHTML="<input name=F002 maxlength=60 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(3).innerHTML="<input name=F003 maxlength=12 onblur='calDate(this)' ondblclick='getDateFromDialog(this);' size=12 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(4).innerHTML="<input name=F004 maxlength=3 onchange='calAge(this)' size=5 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(5).innerHTML="<input name=F005 onblur='checkDecimalInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(6).innerHTML="<input name=F006 maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(7).innerHTML="<span class=delbutton onclick=DeleteTr(this,1)>"</span>";
FormAdd.F001[i-1].focus(); //增加后将第一列设为当前焦点激活状态，以方便输入数据。
}
function getDateFromDialog(obj) //利用弹出输入日期
{
checkDateInput(obj);
var a=showModalDialog("calendar.htm",obj.value.replace(/[-/.]/g,"//"),"status:no;resizable:no;help:no;dialogHeight:220px;dialogWidth:319px;DialogLeft:"+event.screenX+";DialogTop:"+event.screenY);
if (a!=null) obj.value=a;
}
//日期+时长=>新的日期
function getfmtDate(d,i,u)
{
var l;
switch (u)
{
case "d":
l = i*24*60*60*1000;
break;
case "m":
l = i*24*60*60*1000*30;
break;
case "y":
l = i*24*60*60*1000*365;
break;
default:
l = 0;
break;
}
var dt = new Date(new Date().getTime()+l);
return dt.getFullYear()+"-"+("0"+(1+dt.getMonth())).slice(-2)+"-"+("0"+dt.getDate()).slice(-2);
}
//日期1-日期2 = 时长
function getfmtNum(d1,d2,u)
{
var l;
var strSeparator = "-";
var s1;
var s2;
s1 = d1.split(strSeparator);
s2 = d2.split(strSeparator);
var strDateS = new Date(s1[0] + "/" + s1[1] + "/" + s1[2]);
var strDateE = new Date(s2[0] + "/" + s2[1] + "/" + s2[2]);
dt = strDateS-strDateE;
switch (u)
{
case "d":
l = dt/(24*60*60*1000);
break;
case "m":
l = dt/(24*60*60*1000*30);
break;
case "y":
l = dt/(24*60*60*1000*365);
break;
default:
l = 0;
break;
}
return Math.round(l);
}
function now()
{
var d=new Date();
return d.getYear()+"-" +(d.getMonth() + 1) + "-" + d.getDate() ;
}
function calDate(obj,min,max) //验证日期,如正确，则计算出相应的年龄。
{
//alert(document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value+';'+document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value);
if(!checkDateInput(obj,min,max)) return;
document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value=
getfmtNum(now(),document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value,"y");
}
function calAge(obj,min,max) //验证年龄,如正确，则计算出相应的出生日期。
{
//alert(document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value+';'+document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value);
if(!checkIntInput(obj,min,max)) return;
document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value=getfmtDate(new Date(),document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value*(-1),"y");
}
function checkDateInput(obj) //用于检查日期输入是否正确 （日期输入范围为1000-01-01 到9999-12-31）
{
if (obj.value.length==0) return false;
var objValue=obj.value.replace(/[-/.]/g,"/");
try
{
var a=new Date(objValue);
if (isNaN(a))
{
// obj.value="";
alert("请注意:/n您输入的日期不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
var b;
if (a.getFullYear()<1000||a.getFullYear()>9999)
{
var Today=new Date();
b=Today.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
} else if (a.getFullYear()<1000)
b=(a.getFullYear()+100)+"-"+(a.getMonth()+1)+"-"+a.getDate();
else
b=a.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
obj.value=obj.value.replace(/[-/.//]0*/g,"-");
/* if(b!=obj.value)
{
obj.value=b;
alert("请注意:/n您刚才输入的日期不正确,我们已进行了修改.");
obj.select();
obj.focus();
return false;
}*/
}
catch(Exception)
{
// obj.value="";
alert("请注意:/n您输入的日期不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
return true;
}
function checkDecimalInput(obj,min,max) //作用是将输入变成Number(10,6)格式,默认范围是非负.
{
obj.value=obj.value.replace(/ /g,""); //去空格
if (obj.value=="") return false;
if (obj.value.substr(0,1)==".") obj.value="0"+obj.value;
if (obj.value.substr(0,2)=="-.") obj.value=obj.value.replace("-.","-0.");
var r, re;
var s = obj.value ;
var theMin=-0.0000001;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
re = /-{0,1}/d{1,10}/.{0,1}/d{0,6}/i;
r = s.match(re); //取数
if (r==null)
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
/* if ( r!=s)
{
obj.value=r;
alert("请注意:/n您刚才输入的数值不正确,我们已进行了修改.");
obj.focus();
obj.select();
return false;
}*/
obj.value=r;
return true;
}
function checkIntInput(obj,min,max) //作用是将输入变成整数,默认范围是非负.onblur event
{
obj.value=obj.value.replace(/ /g,""); //去空格
if(obj.value=="") return false;
var r;
var s = obj.value ;
var theMin=-1;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
r = parseInt(s); //取数
if (r==null||isNaN(r))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
/* if ( r!=s)
{
obj.value=r;
alert("请注意:/n您刚才输入的整数不正确,我们已进行了修改.");
obj.focus();
obj.select();
return false;
}*/
obj.value=r;
return true;
}
function Confirm0()
{
FormAdd.action="getdata.asp";
FormAdd.submit();
}
</SCRIPT>
<!-- =================================================================================== -->
<script defer>
function Tonclk(o1,o2)
{
(o1.style.display=='none')?(o1.style.display='block'):(o1.style.display='none');
(o1.style.display=='none')?(o2.innerHTML='Ú'):(o2.innerHTML='Ù');
}
function createTable(o,ti,tj,cont)
{
var grow;
var table=document.createElement("TABLE")
o.appendChild(table) ;
table.id="RoomNumberTypeDetail";
table.border=0;
table.style.backgroundColor="green";
table.cellSpacing=1;
table.cellPadding=3;
table.align="center";
table.width="100%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="15%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="10%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var tbody=document.createElement("TBODY")
table.appendChild(tbody) ;
var tr=document.createElement("TR");
tbody.appendChild(tr) ;
tr.align="center";
tr.style.cssText="font-size:11pt;font-weight:700;background-color:#DDDDDD";
for (var j=0;j<=(tj-1);j++){
var td=document.createElement("TD") ;
tr.appendChild(td);
td.innerText=glc[j];
}
for (var i=0;i<=(ti-1);i++){
var tr=document.createElement("TR");
tbody.appendChild(tr) ;
tr.align="center";
if (i&1) tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7DDE7";
else tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7E7DD";
for (var j=0;j<=(tj-1);j++){
var td=document.createElement("TD") ;
tr.appendChild(td) ;
switch (j)
{
case 0: //序号
td.style.cssText= "font-weight:700";
td.innerHTML= (i+1) ;
td.align="center";
break;
case 1:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 2:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=60 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 3:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=10 onblur='calDate(this)' ondblclick='getDateFromDialog(this);' size=12 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 4:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=3 onchange='calAge(this)' size=5 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 5:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onblur='checkDecimalInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 6:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onblur='checkIntInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 7: //删除标志
td.innerHTML= "<span class=delbutton onclick='DeleteTr(this,1)'>"</span>";
break;
default:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
}
}
tr.onmouseover=function()
{
this.style.backgroundColor ="#AAAAFF";
grow = this.rowIndex+1; //TH
}
tr.onmouseout=function()
{
if (grow&1) this.style.backgroundColor="#E7DDE7";
else this.style.backgroundColor="#E7E7DD";
}
}
}
var glc = new Array(
"序号","姓名","籍贯","生日","年龄","身高","学历","删除",
"2","22","222","1980-1-1","","22222","","",
"3","33","333","1987-12-12","","33333","",""
);
createTable(T4,2,8,glc);
</SCRIPT>
</body>
以下是提交后的处理程序getdata.asp:
<%@ LANGUAGE="VBSCRIPT"%>
<!-- #include file = "../adovbs.inc"-->
<%
' getdata.asp
response.expires=0
response.write("Request.Form:<BR/>")
For Each item In Request.Form("GLC")
'response.write("Request.querystring<BR/>")
'For Each item In Request.querystring("GLC")
Response.Write item & "<BR>"
Next
%>
<head>
<script type="text/javascript">
function access()
{
document.getElementById('Append').accessKey="a"
document.getElementById('Confirm').accessKey="c"
document.getElementById('DelAll').accessKey="d"
document.getElementById('DelLst').accessKey="f"
}
</script>
</head>
Gu Laicheng, 2008.2.16<BR/>
生成一个可以编辑的表格,并可以动态地添加行,每次添加的行数可以控制,目前是MaxNumber=20.:<BR/>
可以和已有的明细纪录一起编辑.已有的明细纪录的序号为粗体字。<BR/>
注意:< div id=T4>< /div> 要放在FORM中.<BR/>
字符串有长度约束；数据型有合法性验证；日期型有合法性验证。<BR/>
输入年龄，自动计算出生日期；输入出生日期，自动计算年龄。<BR/>
回车符等同TAB制表符.<BR/>
有alt+快捷键功能，特别是，在按下alt+a时，焦点自动转到第一列的输入域中，以方便操作。<BR/>
提交后，可以获得表格中的数据，并生成insert语句 .
<style>
input
{
BORDER-LEFT: #FFFFFF 1px solid;
BORDER-TOP: #FFFFFF 1px solid;
BORDER-RIGHT: #FFFFFF 1px solid;
BORDER-BOTTOM: #FFFFFF 1px solid
PADDING-RIGHT: 0px;
PADDING-LEFT: 1px;
FONT-SIZE: 1em;
PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle;
PADDING-TOP: 2px;
}
.delbutton
{
font-family: Wingdings;
cursor: hand;
}
</style>
<body onload="access()">
<FORM name=FormAdd method=post>
<div id=T4></div>
<INPUT class='bt' type='button' onclick='InsertRoomNoType(RoomNumberTypeDetail);' value='增加详细(a)' name='Append'>
<INPUT class='bt' type='button' onclick='Confirm0();' value='确认(c)' name='Confirm'>
<INPUT class='bt' type='button' onclick='DeleteAllTr(1);' value='删除全部(d)' name='DelAll'>
<INPUT class='bt' type='button' onclick='DelLowLine(0);' value='删除最后一行(f)' name='DelLst'>
</FORM>
<SCRIPT language=javascript>
//全局ja变量
var MaxNumber=20 //一次可以最多增加的房量详细信息
var AddHowRecord=0 //当前加了几个了
//删除指定表格下拉框所选中的行
function DeleteTr(o,f)
{
var delrow = o.parentNode.parentNode.rowIndex;
if (f && !confirm("您确信要删除此行["+delrow+"]明细信息吗?")) return;
RoomNumberTypeDetail.deleteRow(delrow);
AddHowRecord--;
var ttl=RoomNumberTypeDetail.rows.length;
for(var i=delrow; i<ttl; i++)
{
RoomNumberTypeDetail.rows[i].cells[0].innerText = i;
}
}
//删除全部的行
function DeleteAllTr(f)
{
if (f && !confirm("您确信要删除全部行明细信息吗?")) return;
var ttl = RoomNumberTypeDetail.rows.length;
for(var i=1; i<ttl; i++)
{
RoomNumberTypeDetail.deleteRow(1); //由于是动态表格,这里是1,而不是i
AddHowRecord--;
}
}
//删除最后一行
function DelLowLine(f)
{
if (f && !confirm("您确信要删除最后一行明细信息吗?")) return;
var ttl = RoomNumberTypeDetail.rows.length;
if (ttl==1) return;
RoomNumberTypeDetail.deleteRow(ttl-1);
AddHowRecord--;
}
//说明:通过js插入房量详细信息显示
//参数:要插入表格的ID值
function InsertRoomNoType(tab)
{
if (AddHowRecord>=MaxNumber)
{
alert("每次最多只能增加"+MaxNumber+"条明细.如要增加更多,请先保存后再增加!");
return false;
}
var i=RoomNumberTypeDetail.rows.length;
var TrId="";
AddHowRecord++;
tr=tab.insertRow();
TrId="TrId" + tab.rows.length;
tr.id = TrId;
tr.align="center";
if (!(i&1)) tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7DDE7";
else tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7E7DD";
tr.onmouseover=function()
{
this.style.backgroundColor ="#AAAAFF";
grow = this.rowIndex+1; //TH
}
tr.onmouseout=function()
{
if (grow&1) this.style.backgroundColor="#E7DDE7";
else this.style.backgroundColor="#E7E7DD";
}
td = tr.insertCell(0);
td.innerHTML=i;
tr.insertCell(1).innerHTML="<input name=F001 maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(2).innerHTML="<input name=F002 maxlength=60 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(3).innerHTML="<input name=F003 maxlength=12 onblur='calDate(this)' ondblclick='getDateFromDialog(this);' size=12 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(4).innerHTML="<input name=F004 maxlength=3 onchange='calAge(this)' size=5 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(5).innerHTML="<input name=F005 onblur='checkDecimalInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(6).innerHTML="<input name=F006 maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
tr.insertCell(7).innerHTML="<span class=delbutton onclick=DeleteTr(this,1)>"</span>";
FormAdd.F001[i-1].focus(); //增加后将第一列设为当前焦点激活状态，以方便输入数据。
}
function getDateFromDialog(obj) //利用弹出输入日期
{
checkDateInput(obj);
var a=showModalDialog("calendar.htm",obj.value.replace(/[-/.]/g,"//"),"status:no;resizable:no;help:no;dialogHeight:220px;dialogWidth:319px;DialogLeft:"+event.screenX+";DialogTop:"+event.screenY);
if (a!=null) obj.value=a;
}
//日期+时长=>新的日期
function getfmtDate(d,i,u)
{
var l;
switch (u)
{
case "d":
l = i*24*60*60*1000;
break;
case "m":
l = i*24*60*60*1000*30;
break;
case "y":
l = i*24*60*60*1000*365;
break;
default:
l = 0;
break;
}
var dt = new Date(new Date().getTime()+l);
return dt.getFullYear()+"-"+("0"+(1+dt.getMonth())).slice(-2)+"-"+("0"+dt.getDate()).slice(-2);
}
//日期1-日期2 = 时长
function getfmtNum(d1,d2,u)
{
var l;
var strSeparator = "-";
var s1;
var s2;
s1 = d1.split(strSeparator);
s2 = d2.split(strSeparator);
var strDateS = new Date(s1[0] + "/" + s1[1] + "/" + s1[2]);
var strDateE = new Date(s2[0] + "/" + s2[1] + "/" + s2[2]);
dt = strDateS-strDateE;
switch (u)
{
case "d":
l = dt/(24*60*60*1000);
break;
case "m":
l = dt/(24*60*60*1000*30);
break;
case "y":
l = dt/(24*60*60*1000*365);
break;
default:
l = 0;
break;
}
return Math.round(l);
}
function now()
{
var d=new Date();
return d.getYear()+"-" +(d.getMonth() + 1) + "-" + d.getDate() ;
}
function calDate(obj,min,max) //验证日期,如正确，则计算出相应的年龄。
{
//alert(document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value+';'+document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value);
if(!checkDateInput(obj,min,max)) return;
document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value=
getfmtNum(now(),document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value,"y");
}
function calAge(obj,min,max) //验证年龄,如正确，则计算出相应的出生日期。
{
//alert(document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value+';'+document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value);
if(!checkIntInput(obj,min,max)) return;
document.forms[0].F003[obj.parentNode.parentNode.rowIndex-1].value=getfmtDate(new Date(),document.forms[0].F004[obj.parentNode.parentNode.rowIndex-1].value*(-1),"y");
}
function checkDateInput(obj) //用于检查日期输入是否正确 （日期输入范围为1000-01-01 到9999-12-31）
{
if (obj.value.length==0) return false;
var objValue=obj.value.replace(/[-/.]/g,"/");
try
{
var a=new Date(objValue);
if (isNaN(a))
{
// obj.value="";
alert("请注意:/n您输入的日期不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
var b;
if (a.getFullYear()<1000||a.getFullYear()>9999)
{
var Today=new Date();
b=Today.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
} else if (a.getFullYear()<1000)
b=(a.getFullYear()+100)+"-"+(a.getMonth()+1)+"-"+a.getDate();
else
b=a.getFullYear()+"-"+(a.getMonth()+1)+"-"+a.getDate();
obj.value=obj.value.replace(/[-/.//]0*/g,"-");
/* if(b!=obj.value)
{
obj.value=b;
alert("请注意:/n您刚才输入的日期不正确,我们已进行了修改.");
obj.select();
obj.focus();
return false;
}*/
}
catch(Exception)
{
// obj.value="";
alert("请注意:/n您输入的日期不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
return true;
}
function checkDecimalInput(obj,min,max) //作用是将输入变成Number(10,6)格式,默认范围是非负.
{
obj.value=obj.value.replace(/ /g,""); //去空格
if (obj.value=="") return false;
if (obj.value.substr(0,1)==".") obj.value="0"+obj.value;
if (obj.value.substr(0,2)=="-.") obj.value=obj.value.replace("-.","-0.");
var r, re;
var s = obj.value ;
var theMin=-0.0000001;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
re = /-{0,1}/d{1,10}/.{0,1}/d{0,6}/i;
r = s.match(re); //取数
if (r==null)
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
/* if ( r!=s)
{
obj.value=r;
alert("请注意:/n您刚才输入的数值不正确,我们已进行了修改.");
obj.focus();
obj.select();
return false;
}*/
obj.value=r;
return true;
}
function checkIntInput(obj,min,max) //作用是将输入变成整数,默认范围是非负.onblur event
{
obj.value=obj.value.replace(/ /g,""); //去空格
if(obj.value=="") return false;
var r;
var s = obj.value ;
var theMin=-1;
var theMax=10000000000;
if (min!=null) theMin=min;
if (max!=null) theMax=max;
if (s.length==0) return false;
r = parseInt(s); //取数
if (r==null||isNaN(r))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
if ((r>=theMax)||(r<=theMin))
{
// obj.value="";
alert("请注意:/n您输入的数值不正确,请重新输入.");
obj.focus();
obj.select();
return false;
}
/* if ( r!=s)
{
obj.value=r;
alert("请注意:/n您刚才输入的整数不正确,我们已进行了修改.");
obj.focus();
obj.select();
return false;
}*/
obj.value=r;
return true;
}
function Confirm0()
{
FormAdd.action="getdata.asp";
FormAdd.submit();
}
</SCRIPT>
<!-- =================================================================================== -->
<script defer>
function Tonclk(o1,o2)
{
(o1.style.display=='none')?(o1.style.display='block'):(o1.style.display='none');
(o1.style.display=='none')?(o2.innerHTML='Ú'):(o2.innerHTML='Ù');
}
function createTable(o,ti,tj,cont)
{
var grow;
var table=document.createElement("TABLE")
o.appendChild(table) ;
table.id="RoomNumberTypeDetail";
table.border=0;
table.style.backgroundColor="green";
table.cellSpacing=1;
table.cellPadding=3;
table.align="center";
table.width="100%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="15%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="20%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="10%";
var COL=document.createElement("COL"); table.appendChild(COL); COL.width="5%";
var tbody=document.createElement("TBODY")
table.appendChild(tbody) ;
var tr=document.createElement("TR");
tbody.appendChild(tr) ;
tr.align="center";
tr.style.cssText="font-size:11pt;font-weight:700;background-color:#DDDDDD";
for (var j=0;j<=(tj-1);j++){
var td=document.createElement("TD") ;
tr.appendChild(td);
td.innerText=glc[j];
}
for (var i=0;i<=(ti-1);i++){
var tr=document.createElement("TR");
tbody.appendChild(tr) ;
tr.align="center";
if (i&1) tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7DDE7";
else tr.style.cssText="font-size:11pt;color:#333333;background-color:#E7E7DD";
for (var j=0;j<=(tj-1);j++){
var td=document.createElement("TD") ;
tr.appendChild(td) ;
switch (j)
{
case 0: //序号
td.style.cssText= "font-weight:700";
td.innerHTML= (i+1) ;
td.align="center";
break;
case 1:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 2:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=60 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 3:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=10 onblur='calDate(this)' ondblclick='getDateFromDialog(this);' size=12 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 4:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=3 onchange='calAge(this)' size=5 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 5:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onblur='checkDecimalInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 6:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onblur='checkIntInput(this)' onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
case 7: //删除标志
td.innerHTML= "<span class=delbutton onclick='DeleteTr(this,1)'>"</span>";
break;
default:
td.innerHTML = "<input name=F00"+j+" value='"+glc[tj+i*tj+j]+"' maxlength=20 onkeydown='javascript:if(event.keyCode==13)event.keyCode=9' />";
break;
}
}
tr.onmouseover=function()
{
this.style.backgroundColor ="#AAAAFF";
grow = this.rowIndex+1; //TH
}
tr.onmouseout=function()
{
if (grow&1) this.style.backgroundColor="#E7DDE7";
else this.style.backgroundColor="#E7E7DD";
}
}
}
var glc = new Array(
"序号","姓名","籍贯","生日","年龄","身高","学历","删除",
"2","22","222","1980-1-1","","22222","","",
"3","33","333","1987-12-12","","33333","",""
);
createTable(T4,2,8,glc);
</SCRIPT>
</body>
以下是提交后的处理程序getdata.asp:
<%@ LANGUAGE="VBSCRIPT"%>
<!-- #include file = "../adovbs.inc"-->
<%
' getdata.asp
response.expires=0
response.write("Request.Form:<BR/>")
For Each item In Request.Form("GLC")
'response.write("Request.querystring<BR/>")
'For Each item In Request.querystring("GLC")
Response.Write item & "<BR>"
Next
%>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- asp.net在表格中动态生成一个可以链接到另外一个页面的图片
- 动态生成 指定列数、行数的表格。并在每行最后一列添加一个删除按钮。点击删除按钮、删除本行！
- 可编辑的table. 添加数据，修改数据。稍加修改就可以部署到ajax 动态表格中
- JS生成动态表格并为每个单元格添加单击事件的方法
- 给phpcms v9专题添加一个radio单选按钮，可以多次利用专题创建不同的栏目进行内容编辑，给专题添加一个自定义字段
- 发布一个类似Subsonic语法的动态生成SQL语句，并可以返回相应实体类的一个组件
- 使用jQuery动态创建一个表格，根据用户数输入的内容添加一行数据
- JSP页面动态生成表格并为表格添加事件(续)
- HTML动态生成指定行数和列数的可编辑表格
- R语言-networkd3.生成一个基于html的插件，可以动态交互，
- 编辑 Ext 表格（一）——— 动态添加删除行列
- 发布一个类似Subsonic语法的动态生成SQL语句，并可以返回相应实体类的一个组件
- 使用该JavaBean可以将数据在JSP页面中以表格的形式显示出来，并具有动态排序、动态生成查询、自动分页功能
- Javascript中给动态生成的表格添加样式，JavaScript里setAttribute的问题
- 一个c#上传的程序，可以生成缩略图也可以自由添加水印效果
- 结构型模式02-装饰者模式（动态为一个对象添加职责，就增加功能而言，装饰模式比生成子类更加灵活）
- 一个c#上传的程序，可以生成缩略图也可以自由添加水印效果
- 编辑 Ext 表格（一）——— 动态添加删除行列
- javascript动态生成表格，并实现对表格行的添加和删除
- java jacob 操作word 文档，进行写操作，如生成表格，添加 图片(这个不错，可以拿来直接用，非常好)