Database Form Functions with HTML - The Code
(Page 4 of 4 )
From now onward we shall be talking about the JavaScript until we reach the point of talking about Tabular Forms, as I indicated in part one of this series.
The setFirstRow() Function
This is the function that is first called when the web page opens. The function first determines the total number of rows of the Table recordset. It does this with the following statements:
var rowCollection = document.getElementById('Recordset').rows;
numberOfRows = rowCollection.length;
The total number of rows is stored in the variable named numberOfRows.
The function then goes on to copy the six data values of the first row of the recordset to the six text input controls. Note that the –1 data of the last field of the recordset-row is never copied to the form. This value is used to control editing (see later).
It goes on to determine and display the row position (the row number of the recordset shown on the form). After this it displays the numberOfRows (total) of the recordset.
It puts the Input controls into the read-only mode.
Finally, it disables the Show-First and Show-Previous buttons.
This is the code:
function setFirstRow()
{
//determine the total number of rows
var rowCollection = document.getElementById('Recordset').rows;
numberOfRows = rowCollection.length;
//show first row values if the recordset is not empty
if (numberOfRows > 0)
{
for (j=0;j<6;j++)
{
//form the input text control ID
CID = "EI" + j;
//form the recordset ID
RID = "TD0" + j;
document.getElementById(CID).value = document.getElementById(RID).innerHTML;
}
}
//show the data row number (position) and total number of rows
if (numberOfRows > 0)
{//rows exist
document.getElementById('RowPosition').value = index + 1;
}
else
{//there are no rows
document.getElementById('RowPosition').value = 0;
}
document.getElementById('TNumberRows').value = numberOfRows;
makeReadOnlyInputControls();
//disable the showFirstRow and showPreviousRow Buttons
disableButtons('SFA1','SP1');
//if the recordset is empty, disable the showNextRow and showLastRow Buttons as well.
if (numberOfRows == 0)
{
disableButtons('SN1','SL1');
}
}
We continue in the next part of the series.
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |