Menu
hey i have used following script for adding the row..
i gets lots of help from help from KOR..iam really thanksful to him.
now this is my final work..in which i have total 5 default row,in which user can entry the details..now it wants to enter more detail..he has to click add button and it automatically increase the one row after checking that all the rows values has been taken..
1) now i want to do that if user click on add button the next row values should be like that:
Ac.code_6
—-
2) and there is one field tdebit and tcredit..which should be total of the debit and credit field for all the rows…and when user try to submit the form..and if the tdebit and tcredit field not equal..it displays alert message…
help me for this two problem…as soon as possible…
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<meta http-equiv=”Content-Style-Type” content=”text/css”>
<meta http-equiv=”Content-Script-Type” content=”text/javascript”>
<script language=”JavaScript” type=”text/JavaScript”>
//genuine code by Corneliu Lucian ‘KOR’ Rusu [email][email protected]
function addR(){
var oTab = document.getElementById(‘tab’);// the table element
var oRows = oTab.getElementsByTagName(‘tr’);// the rows collection
var root = oRows[1].parentNode;//the root for the future append
var newRow = oRows[1].cloneNode(true);//clone the second row with the entire content
var oFields = oTab.getElementsByTagName(‘input’)//the text field collection
for (var i=0;i<oFields.length;i++){
if(oFields[i].getAttribute(‘value’).length<1){
alert(‘Please, fill in all the text fields!’);//alerts
oFields[i].focus();//focuses the empty field
return false//stops if one of the text fields is not filled
}
}
var newFields = newRow.getElementsByTagName(‘input’);//the fields in the cloned row collection
for(var i=0;i<newFields.length;i++){
newFields[i].setAttribute(‘name’,newFields[i].getAttribute(‘name’)+’_‘+oRows.length);//sets the new incremented names
newFields[i].setAttribute(‘value’,”);//clears the values
}
var newSel = newRow.getElementsByTagName(‘select’);//the select elements in the cloned row collection
for(var i=0;i<newSel.length;i++){
newSel[i].setAttribute(‘name’,newSel[i].getAttribute(‘name’)+’
newSel[i].setAttribute(‘value’,”);//clears the selects’ values
}
root.insertBefore(newRow,document.getElementById(‘tot’));//appends the new row
}
function addT(n,f){
var re = /^[0-9]*$/;
if (!re.test(f.value)) {//validate for numbers input
alert(“Value must be all numeric characters, non numeric’s removed from field!”);
f.value = f.value.replace(/[^0-9]/g,””);
}
var vTot=”;
var oTab = document.getElementById(‘tab’);// the table element
var oRows = oTab.getElementsByTagName(‘tr’);// the rows collection
var cIndex= f.parentNode.cellIndex;//the index of the cell in row
for(var i=1;i<oRows.length-1;i++){
vTot = vTot[i].getElementsByTagName(‘input’)[cIndex].getAttribute(‘value’)*1;//calculates the total
}
document.forms[0].elements[n].value = vTot//assigns the total
}
</script>
</head>
<table id=”tab” width=”50%” border=”3″ cellspacing=”0″ cellpadding=”0″>
<tbody>
<tr>
<th>A/C Cd.</th>
<th>Description</th>
<th>S.L Code</th>
<th>Description</th>
<th>Debit</th>
<th>Credit</th>
</tr>
<tr>
<td><input type=”text” name=”Ac.code” size=”5″ maxlength=”5″>
</td>
<td> <input type=”text” name=”description” size=”30″>
</td>
<td><input type=”text” name=”slcode” size=”10″ >
</td>
<td> <input type=”text” name=”description1″ size=”30″ >
</td>
<td><input type=”text” name=”debit” size=”12″ onclick=”
var ochqamt = parseFloat(this.form.chqamt.value);
this.value = ochqamt;” readonly></td>
<td> <input type=”text” name=”credit” size=”12″ onclick=” this.value = “”;”readonly></td>
</tr>
<tr>
<td><input type=”text” name=”Ac.code_2″ size=”5″ maxlength=”5″>
</td>
<td> <input type=”text” name=”description_2″ size=”30″>
</td>
<td><input type=”text” name=”slcode_2″ size=”10″ >
</td>
<td> <input type=”text” name=”description1_2″ size=”30″ >
</td>
<td><input type=”text” name=”debit_2″ size=”12″ >
</td>
<td> <input type=”text” name=”credit_2″ size=”12″ ></td>
</tr>
<tr>
<td><input type=”text” name=”Ac.code_3″ size=”5″ maxlength=”5″>
</td>
<td> <input type=”text” name=”description_3″ size=”30″>
</td>
<td><input type=”text” name=”slcode_3″ size=”10″ >
</td>
<td> <input type=”text” name=”description1_3″ size=”30″ >
</td>
<td><input type=”text” name=”debit_3″ size=”12″ >
</td>
<td> <input type=”text” name=”credit_3″ size=”12″ ></td>
</tr>
<tr>
<td><input type=”text” name=”Ac.code_4″ size=”5″ maxlength=”5″>
</td>
<td> <input type=”text” name=”description_4″ size=”30″>
</td>
<td><input type=”text” name=”slcode_4″ size=”10″ >
</td>
<td> <input type=”text” name=”description1_4″ size=”30″ >
</td>
<td><input type=”text” name=”debit_4″ size=”12″ >
</td>
<td> <input type=”text” name=”credit_4″ size=”12″ ></td>
</tr>
<tr>
<td><input type=”text” name=”Ac.code_5″ size=”5″ maxlength=”5″>
</td>
<td> <input type=”text” name=”description_5″ size=”30″>
</td>
<td><input type=”text” name=”slcode_5″ size=”10″ >
</td>
<td> <input type=”text” name=”description1_5″ size=”30″ >
</td>
<td><input type=”text” name=”debit_5″ size=”12″ >
</td>
<td> <input type=”text” name=”credit_5″ size=”12″ ></td>
</tr>
</tbody>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><center><b>TOTAL</b></center></td>
<td> <input type=”text” name=”tdebit” size=”12″ onfocus=”tDebit(this.form);”> </td>
<td> <input type=”text” name=”tcredit” size=”12″ onclick=”tDebit(this.form);”> </td>
</tr>
</table><br><br>
<center>
<input type=”submit” value=”Submit” >
<input type=”button” value=”ADD” onclick=”return addR()”>