Home arrow HTML arrow Page 6 - More Database Form Functions with HTML
HTML

More Database Form Functions with HTML


This is the fourth chapter of a thirteen part series regarding the creation of database forms with HTML. In this article we will continue discussing the functions relevant to the development process, including showNextRow(), showLastRow(), showFirstRow(), addRow(), and addRowToRecordset(). Join us as we edge toward completion.

Author Info:
By: Chrysanthus Forcha
Rating: 3 stars3 stars3 stars3 stars3 stars / 4
July 30, 2008
TABLE OF CONTENTS:
  1. · More Database Form Functions with HTML
  2. · The showPreviousRow() Function
  3. · The showLastRow() Function
  4. · The showFirstRow() Function
  5. · The addRow() function
  6. · The addRowToRecordset() Function

print this article
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
More Database Form Functions with HTML - The addRowToRecordset() Function
(Page 6 of 6 )

The addRowToRecordset() function adds a row with the information in the form Input controls to the end of the recordset. It also calls the includeInTransmittedTable('ADDED') function. This function adds the copy of the row added to the recordset to the Transmitted Table. The argument “ADDED” is the value for the last field in the row (copy) of the Transmitted Table.

Remember that if the form starts with an empty recordset, all the navigation buttons are disabled. In this case, while you are adding rows to the recordset, you enable the Show-First and Show-Previous buttons, so that you can navigate back to the rows you have added. So when the number of rows added to the recordset reaches 2, the addRowToRecordset() function enables these buttons.

To understand the details of the addRowToRecordset() function, you need to have basic knowledge in HTML DOM Table object, HTML DOM Row object, and HTML DOM Table Cell object. This is the code of the function:


function addRowToRecordset()

{

//the row is added at the end of the recordset - you can sort afterwards

//insert a blank row at the end of the table

document.getElementById('Recordset').insertRow(numberOfRows - 1);

 

//form the ID of the new row

rowID = 'TR' + (numberOfRows-1);

//give the new row its ID

document.getElementById('Recordset').rows[numberOfRows - 1].id = rowID;

 

//insert blank cells, give them IDs and their contents

for (j=0;j<6;j++)

{

//form ID for table cell

RID = "TD" + (numberOfRows - 1) + j;

 

//form the input text control ID

ID = "EI" + j;

 

document.getElementById('Recordset').rows[numberOfRows - 1].insertCell(j);

document.getElementById('Recordset').rows[numberOfRows - 1].cells[j].id = RID;

document.getElementById('Recordset').rows[numberOfRows - 1].cells[j].innerHTML = document.getElementById(ID).value;

}

 

//add the seventh blank cell with the value, -1, which shows that the row has not been edited

document.getElementById('Recordset').rows[numberOfRows - 1].insertCell(6);

document.getElementById('Recordset').rows[numberOfRows - 1].cells[6].innerHTML = "-1";

 

includeInTransmittedTable('ADDED');

 

//If numberOfRows is 2, enable showFirstRow and showPreviousRow Buttons since they are still disabled.

if (numberOfRows == 2)

{

enableButtons('SFA1','SP1');

index = 1; //this will be used in setting the row position number

}

}


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.

blog comments powered by Disqus
HTML ARTICLES

- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5
- BBC Adopts HTML 5, Mozilla Addresses Issues
- Advanced Sticky Footers in HTML and CSS
- HTML and CSS Sticky Footers
- Strategy Analytics Predicts HTML5 Phones to ...
- HTML5 Guidelines for Web Developers
- Learning HTML5 Game Programming
- More Engaging CSS3 and HTML Background Effec...
- Engaging HTML and CSS3 Background Effects
- More Web Columns with CSS3 and HTML
- Columns with CSS3 and HTML
- Creating Inline-Block HTML Elements with CSS
- Drag and Drop in HTML5: Parsing Local Files

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 8 - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials