Edit and Other Database Form Functions with HTML
(Page 1 of 4 )
This is the fifth part of a thirteen part series covering how to build database forms with HTML. We will start with a couple of edit functions and the deleteRow() function. Then we will go over the function that ties them all together and the function that completes the execution.
When you click the Edit button, the editRow() function is called.
The editRow() Function
It starts by assigning the global editMode variable to true. It disables these buttons: Edit, Delete, Clear, Find, and Sort. It is not proper for these buttons to be enabled when you are in the Edit mode. This way the programmer protects the user from corrupting his own data. This also makes use of the form convenient. The code then frees the text Input controls for writing (typing). This is the code:
function editRow()
{
editMode = true;
//disable the buttons, Edit, Delete, Clear, Find, Sort.
disableButtons('E1','D1','C1','F1','So1');
//make input controls write-able
makeWriteInputControls();
}
Note: It is not the editRow() function that edits the record in the recordset. When you have finished typing (modifying) the Input control fields, an event has to be triggered before the corresponding record in the recordset can be edited with the modified values in the Input controls.
The editRowToRecordset() Function
When you have finished modifying the Input control fields, the next thing you have to do is click any button that is enabled. After you have finished modifying the Input controls, the editMode variable is still true. When any of these buttons are clicked, their corresponding functions begin by checking if you were in the Edit mode (i.e. if editMode = true). If it is true, it calls our editRowToRecordset() function.
The editRowToRecordset() function changes the data in the corresponding row of the recordset and calls the “includeInTransmittedTable('EDITED')” function. The includeInTransmittedTable() function makes a copy of the edited row in the Transmitted Table. The value “EDITED” is passed. As I said, this value will be the last piece of data in the copied row of the Transmitted Table. At the server, the program-file that receives the processed rows will use this data to know that this was an edited row. This is the code for the editRowToRecordset() function:
function editRowToRecordset()
{
//change the data values for the recordset
for (j=0;j<6;j++)
{
//form the input text control ID
ID = "EI" + j;
document.getElementById('Recordset').rows[index].cells[j].innerHTML = document.getElementById(ID).value;
}
includeInTransmittedTable('EDITED');
}
Next: The deleteRow() Function >>
More HTML Articles
More By Chrysanthus Forcha