...

View Full Version : validation in dom



no_friends
11-22-2008, 02:04 AM
hi
i m using dom for creating row in my existing table.
below is table code


<table class="DocumentLines" cellpadding="1" cellspacing="1" id="LinesTable">
<tr>
<th rowspan="2">Product Code</th>
<th rowspan="2">Description</th>
</tr>
</table>
<table class="DocumentLines" cellpadding="1" cellspacing="1">
<tr>
<td align="right">
<input type="button" value="Add New Line" onclick="javascript:mAddLine();">
<input type="hidden" name="txtNextLineNumber" value="1">
</td>
</tr>
</table>
<input type="submit" value="Send Document"/>


after clicking on add new line button i m able to new row in my existing table.below is code for adding new row


function mAddLine()
{
var lLineNumber;
var objNewRow;
var objNewCell;

lLineNumber = document.all.item('txtNextLineNumber').value;
objNewRow = document.all.item('LinesTable').insertRow();
if(document.all.item('LinesTable').rows(document.a ll.item('LinesTable').rows.length - 2).className == 'listrow0')
{
objNewRow.className = 'listrow1';
}
else
{
objNewRow.className = 'listrow0';
}

objNewCell = objNewRow.insertCell();
objNewCell.insertAdjacentHTML('beforeEnd', '<div id="divDetailLookup' + lLineNumber + '"><input type="text" name="txtSuppliersProductCode' + lLineNumber + '" style="width:65%"><a href="javascript:mGetProductDetails(' + lLineNumber + ')"><img src="/images/View_icon.gif" border="0" alt="Fetch product details"/></a></div>');

objNewCell = objNewRow.insertCell();
objNewCell.insertAdjacentHTML('beforeEnd', '<input type="hidden" name="txtBuyersProductCode' + lLineNumber + '">');
objNewCell.insertAdjacentHTML('beforeEnd', '<input type="hidden" name="txtPackSize' + lLineNumber + '">');
objNewCell.insertAdjacentHTML('beforeEnd', '<input type="text" name="txtProductDescription' + lLineNumber + '" style="width:100%">');

objNewCell = objNewRow.insertCell();
objNewCell.insertAdjacentHTML('beforeEnd', '<input onClick="mDeleteRow(this.parentNode.parentNode.rowIndex);" type="Button" name="btnDelete' + lLineNumber + '" value="Delete">');

document.all.item('txtNextLineNumber').value = parseInt(document.all.item('txtNextLineNumber').value) + 1;
}

i have delete button for each created row.when delete button clicked then corresponding row would be deleted.code is here


function mDeleteRow(linenumber)
{

document.all.item('LinesTable').deleteRow(linenumb er);
var objTable = document.getElementById("LinesTable");
for (var i = linenumber; i < objTable.rows.length; i++)
{
var objRow = objTable.rows[i];
objRow.className = (objRow.className == "listrow0") ? "listrow1" : "listrow0";

}
}

now problem is how to do validation.my each row has 2 fields both are manadatory so user should filled it.if not then i want to show alert message product code in line 1 should completed
description in line 1 should completed.and each row has different values for there product code field.

any body please help me out.

hope it make some sense.this is my first post at this forum.
Thank u so much.

no_friends
11-24-2008, 12:46 PM
hi
@@Kor

i have seen this thread
http://www.codingforums.com/archive/index.php/t-95573.html

and said by u after deletion i reset the id of my control like this


for(var i=nLoopStartIndex;i< objTable.rows.length;i++)
{

objTable.rows[i].childNodes[0].childNodes[0].id = "divDetailLookup" +i;
objTable.rows[i].childNodes[0].childNodes[0].childNodes[0].id = "txtSuppliersProductCode"+i ;
objTable.rows[i].childNodes[1].childNodes[0].id = "txtBuyersProductCode"+i;
objTable.rows[i].childNodes[1].childNodes[1].id = "txtPackSize" +i;
objTable.rows[i].childNodes[1].childNodes[2].id = "txtProductDescription"+i ;
}


but problem is after deleting row when i check for duplicate data in product field.it still taking data of deleted row.

what i m missing??

Thanks

hope



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum