如何随机验证动态行

时间：2014-08-29 05:32:00

标签： javascript html html-table cell

我有一个动态行创建，删除和验证。要创建和删除行，它可以正常工作。假设，我删除第一行后，该行无法验证。如果我没有删除第一行，我可以验证剩余。如果我删除任何中间行，则无法验证该行。

<head>
<title>Insert title here</title>
</head>
<body>
 <TD>
<FORM NAME="iForm">
<INPUT type="HIDDEN" name="_row_count" id="_row_count" value="0"  />
<INPUT type="HIDDEN" name="rowcount" id="rowcount" value="0"  />
<P>
<INPUT type="button" value="Add Rows" onclick="addRowToTable();" />
</P>
<TABLE width='100%'  border='1' id="CommTble">  
<TR>
<TH CLASS='vrTableHeader' align='left'> Feild1 </TH> 
<TH CLASS='vrTableHeader' align='left'>Feild2 </TH> 
<TH CLASS='vrTableHeader' align='left'>Remove Field </TH> 
</TR> 
<TR> 
<TD> 
<INPUT TYPE='TEXT'  CLASS='vrFormText'  NAME='field' id='field10' SIZE=15 MAXLENGTH="25" />
</TD> 
<TD> 
<INPUT TYPE='TEXT'  CLASS='vrFormText' NAME='field' id='field20' SIZE=15 MAXLENGTH="25">
</TD> 
<TD>
<INPUT TYPE='button'  CLASS='vrFormText'  NAME='DelButton_0' VALUE='Remove Row' SIZE=20  MAXLENGTH="18" ONCLICK="removeRowFromTable1(this,0);"/>
</TD>  
</TR> 
</TABLE>
<P>
<input type="button" class="submitest" value=" Save Record " name="Submit1" onclick="checkCommodity()">                          
<INPUT TYPE="RESET" NAME="Reset" CLASS="submitreset" VALUE="Reset">
</P>
</FORM>
</TD>
</body>

function addRowToTable()
{
var tbl = document.getElementById('CommTble');
var lastRow = tbl.rows.length; 
var iteration = lastRow-1;
lastRow = tbl.rows.length;
var row = tbl.insertRow(lastRow);
var cellTwo = row.insertCell(0);
var e2 = document.createElement('input');
e2.type = 'text';
e2.name = 'field1'+ iteration;
e2.id = 'field1'+ iteration;
e2.size = '15';  
e2.onkeypress=function(){return imposeMaxLength(this,parseInt(25))};
cellTwo.appendChild(e2);

var cellTwo = row.insertCell(1);
var e3 = document.createElement('input');
e3.type = 'text';
e3.name = 'field2'+ iteration;
e3.id = 'field2'+ iteration;
e3.size = '15';  
e3.onkeypress=function(){return imposeMaxLength(this,parseInt(25))};
cellTwo.appendChild(e3);

var cellNine = row.insertCell(2);
var e9 = document.createElement('input');
e9.type='button';
e9.name='DelButton_'+iteration;
e9.id='DelButton_'+iteration;
e9.value='Remove Row';
e9.size='20';
e9.onclick=function(){return deleteRow(this.parentNode.parentNode.rowIndex)};
cellNine.appendChild(e9);
iForm._row_count.value=iteration;
iteration+=1;
}
function deleteRow(i)
{
document.getElementById('CommTble').deleteRow(i);
}

function checkCommodity()
{
var tble = document.getElementById('CommTble');
var LastRow = tble.rows.length-1;
var rcount=0;
for(var i=0;i<LastRow;i++)
{
var a=document.getElementById('field1'+i).value;
if(document.getElementById("field1"+i+"").value=="")
{      
alert ("field1 value missing");
document.getElementById("field1"+i+"").focus();
return false;
}
if(document.getElementById("field2"+i+"").value=="")
{
alert ("field2 value missing");
document.getElementById("field2"+i+"").focus();
return false;
}   
}
return true;      
}      
var size=0;
var comarray= new Array(100);

function removeRowFromTable1(r,p)
{
var i=r.parentNode.parentNode.rowIndex;
var q=p;

if(isNaN(q)==true)
{
p=q.substr(10);
}
else
{
p=q;
}
comarray[size]=p;
size+=1;
var n=document.getElementById('CommTble').rows.length;
if(n==2)
alert("Atleast one has to be there. So it is not possible to delete the current row !!");
else
document.getElementById('CommTble').deleteRow(i);
}

1 个答案:

答案 0 :(得分：0)

我稍微修改了你的代码。请查看下面的修改代码。它工作正常

<html>
<head>
<title>Insert title here</title>
</head>
<body>
 <TD>
<FORM NAME="iForm">
<INPUT type="HIDDEN" name="_row_count" id="_row_count" value="0"  />
<INPUT type="HIDDEN" name="rowcount" id="rowcount" value="0"  />
<P>
<INPUT type="button" value="Add Rows" onclick="addRowToTable();" />
</P>
<TABLE width='100%'  border='1' id="CommTble">  
<TR>
<TH CLASS='vrTableHeader' align='left'> Feild1 </TH> 
<TH CLASS='vrTableHeader' align='left'>Feild2 </TH> 
<TH CLASS='vrTableHeader' align='left'>Remove Field </TH> 
</TR> 
<TR> 
<TD> 
<INPUT TYPE='TEXT'  NAME='field' id='field10' SIZE=15 MAXLENGTH="25" value="" />
</TD> 
<TD> 
<INPUT TYPE='TEXT'  NAME='field' id='field20' SIZE=15 MAXLENGTH="25" value="" />
</TD> 
<TD>
<INPUT TYPE='button'  CLASS='vrFormText'  NAME='DelButton_0' VALUE='Remove Row' SIZE=20  MAXLENGTH="18" ONCLICK="removeRowFromTable1(this,0);"/>
</TD>  
</TR> 
</TABLE>
<P>
<input type="button" class="submitest" value=" Save Record " name="Submit1" onclick="checkCommodity()">                          
<INPUT TYPE="RESET" NAME="Reset" CLASS="submitreset" VALUE="Reset">
<INPUT TYPE="hidden" id="deleteValue" VALUE="">
</P>
</FORM>
</TD>
</body>
<script>
document.getElementById('deleteValue').value = "";
function addRowToTable()
{
var tbl = document.getElementById('CommTble');
var lastRow = tbl.rows.length; 
var iteration = lastRow-1;
lastRow = tbl.rows.length;
var row = tbl.insertRow(lastRow);
var cellTwo = row.insertCell(0);
var e2 = document.createElement('input');
e2.type = 'text';
e2.name = 'field1'+ iteration;
e2.id = 'field1'+ iteration;
e2.size = '15';  
e2.onkeypress=function(){return imposeMaxLength(this,parseInt(25))};
cellTwo.appendChild(e2);

var cellTwo = row.insertCell(1);
var e3 = document.createElement('input');
e3.type = 'text';
e3.name = 'field2'+ iteration;
e3.id = 'field2'+ iteration;
e3.size = '15';  
e3.onkeypress=function(){return imposeMaxLength(this,parseInt(25))};
cellTwo.appendChild(e3);

var cellNine = row.insertCell(2);
var e9 = document.createElement('input');
e9.type='button';
e9.name='DelButton_'+iteration;
e9.id='DelButton_'+iteration;
e9.value='Remove Row';
e9.size='20';
e9.onclick=function(){return deleteRow(this.parentNode.parentNode.rowIndex)};
cellNine.appendChild(e9);
iForm._row_count.value=iteration;
iteration+=1;
}
function deleteRow(i)
{
var delVal = document.getElementById('deleteValue').value;
if(delVal == ""){
document.getElementById('deleteValue').value = "|"+delVal+i+"|";
}
else{
document.getElementById('deleteValue').value = delVal+i+"|";
}
document.getElementById('CommTble').deleteRow(i);
}

function checkCommodity()
{
var tble = document.getElementById('CommTble');
var LastRow = tble.rows.length-1;
var rcount=0;
var delVal = document.getElementById('deleteValue').value;
for(var i=0;i<LastRow;i++)
{

if(delVal.indexOf("|"+i+"|") <= -1){

var a=document.getElementById("field1"+i).value;
if(document.getElementById("field1"+i+"").value=="")
{      
alert ("field1"+i+" value missing");
document.getElementById("field1"+i+"").focus();
return false;
}
if(document.getElementById("field2"+i+"").value=="")
{
alert ("field2"+i+" value missing");
document.getElementById("field2"+i+"").focus();
return false;
}

}

}
return true;      
}      
var size=0;
var comarray= new Array(100);

function removeRowFromTable1(r,p)
{
var delVal = document.getElementById('deleteValue').value;
if(delVal == ""){
document.getElementById('deleteValue').value = "|"+delVal+p+"|";
}
else{
document.getElementById('deleteValue').value = delVal+p+"|";
}

var i=r.parentNode.parentNode.rowIndex;
var q=p;

if(isNaN(q)==true)
{
p=q.substr(10);
}
else
{
p=q;
}
comarray[size]=p;
size+=1;
var n=document.getElementById('CommTble').rows.length;
if(n==2)
alert("Atleast one has to be there. So it is not possible to delete the current row !!");
else
document.getElementById('CommTble').deleteRow(i);
}

</script>
</html>
相关问题
最新问题