Hi,
Im trying to validate multipe id. Please find the html code and my validation script. My problem in this script is at the first time it validate correctly and throws alert, after when i submit this form the form gets submitted. Can anyone debug this code?. And also Im creating my input box using javascript dynamically.Its not visible in IE. Can anyone fix this also?. Thanks in Advance.
HTML CODE:
<html>
<head>
<title>Mafiree :: Admin</title>
<link type="text/css" rel="stylesheet" href="css/stylesheet.css"></link>
<script language="javascript" type="text/javascript" src="js/common.js"></script>
<script language="javascript" src="js/calander.js"></script>
<script language="javascript">
// - The new row function
var i=1;
function addRow(){
var tbody = document.getElementById("table1").tBodies[0];
var row = document.createElement("TR");
row.setAttribute("id","row"+i);
//alert (i);
var cell= document.createElement("TD");
cell.setAttribute("width","4%");
cell.setAttribute("valign","top");
cell.setAttribute("class","Text_10_Gray");
cell.innerHTML="BILLS :";
var cell11 = document.createElement("input");
cell11.setAttribute("type","radio");
cell11.setAttribute("name","reimb_bills" +i);
cell11.setAttribute("onClick","reimbustment_deactive(1);");
cell11.setAttribute("value","available");
var cell11_td= document.createElement("TD");
cell11_td.setAttribute("width","6%");
cell11_td.setAttribute("valign","top");
cell11_td.setAttribute("class","Text_10_Gray");
cell11_td.innerHTML="Available<br>";
//cell11.setAttribute("checked");
//cell11.setAttribute("value", "1");
var cell111 = document.createElement("input");
cell111.setAttribute("type","radio");
cell111.setAttribute("name","reimb_bills" +i);
cell111.setAttribute("onClick","reimbustment_deactive(2);");
cell111.setAttribute("value","unavailable");
var cell111_td= document.createElement("TD");
cell111_td.setAttribute("width","11%");
cell111_td.setAttribute("valign","top");
cell111_td.setAttribute("class","Text_10_Gray");
cell111_td.innerHTML="Unavailable";
var cell2_td= document.createElement("TD");
cell2_td.setAttribute("width","6%");
cell2_td.setAttribute("valign","top");
cell2_td.setAttribute("class","Text_10_Gray");
cell2_td.innerHTML="BILL DATE :";
var cell2 = document.createElement("input");
cell2.setAttribute("type","text");
cell2.setAttribute("name","reimb_date" +i);
cell2.setAttribute("id","txtFromDate" +i);
var img= document.createElement("img");
img.setAttribute("src","images/cal.gif");
img.setAttribute("onClick","javascript:showCal(`txtFromDate`,``);");
img.setAttribute("width","16");
img.setAttribute("height","16");
var cell3_td= document.createElement("TD");
cell3_td.setAttribute("width","6%");
cell3_td.setAttribute("valign","top");
cell3_td.setAttribute("class","Text_10_Gray");
cell3_td.innerHTML="BILL NO :";
var cell3 = document.createElement("input");
cell3.setAttribute("type","text");
cell3.setAttribute("name","reimb_billno" +i);
var cell4_td= document.createElement("TD");
cell4_td.setAttribute("width","9%");
cell4_td.setAttribute("valign","top");
cell4_td.setAttribute("class","Text_10_Gray");
cell4_td.innerHTML="DESCRIPTION :";
var cell4 = document.createElement("input");
cell4.setAttribute("type","text");
cell4.setAttribute("name","reimb_description" +i);
cell4.setAttribute("id","reimb_description" +i);
var cell5 = document.createElement("input");
cell5.setAttribute("type","hidden");
cell5.setAttribute("name","count");
cell5.setAttribute("value",""+i);
row.appendChild(cell);
row.appendChild(cell11);
row.appendChild(cell11_td);
row.appendChild(cell111);
row.appendChild(cell111_td);
row.appendChild(cell2_td);
row.appendChild(cell2);
row.appendChild(img);
row.appendChild(cell3_td);
row.appendChild(cell3);
row.appendChild(cell4_td);
row.appendChild(cell4);
row.appendChild(cell5);
tbody.appendChild(row);
i++;
//alert("i= " +i);
//alert(row.innerHTML);
}
</script>
</head>
<body onLoad="addRow();">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="left"><img src="images/logo.gif"></td>
</tr>
<tr>
<td><hr></td>
</tr>
<tr>
<td>
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><a href="index.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">HOME</a></td>
<td style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333; text-decoration:none; "><a href="add_users.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">ADD USERS</a></td>
<td style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333; text-decoration:none; "><a href="search_users.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">SEARCH USERS</a></td>
<td style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333; text-decoration:none; "><a href="change_password.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">CHANGE PASSWORD</a></td>
<td><a href="reimbustment.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">REIMBUSTMENT</a></td>
<td><a href="register_meet.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">BANGLORE MEET</a></td>
<td><a href="logout.php" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;color:#333333;">LOGOUT</a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td><hr></td>
</tr>
</table>
<div id="cal" style="display:none;width:160px;position:absolute;"></div>
<table width="100%" border="0" cellpadding="0px" cellspacing="0px">
<tr>
<td>
<table width="95%" border="0" align="center" cellpadding="0" cellspacing="6" style="border:0.01em solid #666666 ">
<tr>
<td class="Text_10_Gray">SUBMIT REIMBUSTMENT</td>
<td><a href="reimbustment_viewall.php" class="Text_10_Gray">VIEW ALL FORMS (Admin)</a></td>
<td ><a href="reimbustment_userview.php" class="Text_10_Gray">VIEW MY FORM (Users)</a></td>
<td ><a href="#" class="Text_10_Gray" id="add_row" onclick="addRow()">ADD MORE FORM</a></td>
<!-- <td><input name="add_row" type="button" id="add_row" value="Add Row" onclick="addRow()" /></td> -->
</tr>
</table>
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>
<form name="reimbustment" action="test.php?ins=y" method="post" onSubmit="return reimbustment_validate_test(i)" >
<table width="95%" border="0" align="center" cellpadding="4" cellspacing="12" style="border:0.01em solid #666666 ">
<tr>
<td class="Text_Black" align="center"><u>REIMBUSTMENT FORM</u></td>
</tr>
<tr>
<td valign="top">
<table width="90%" id="table1" align="center">
<tr>
<td> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center"><input type="submit" name="submit" class="Button" value="SUBMIT"> <input type="reset" class="Button" name="clear" value="CLEAR"></td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</body>
</html>
Javascript validation:
function reimbustment_validate_test(n)
{
for(i=1;i<n;i++)
{
if(document.getElementById(`reimb_description`+i).value =="")
{
alert(`Description should not be empty`);
return false;
}
}
return true;
}
Thanks,
Thiyaghu CK
|
Hot Discussion