Home arrow AJAX & Prototype arrow An Enhanced Ajax Approach to Active Client Pages

An Enhanced Ajax Approach to Active Client Pages

In this final part of a four-part series, I give you my enhancements to the AJAX approach to Active Client Pages. Before I conclude the series, I will introduce two other approaches to you. Keep reading to learn how to help your web pages load more quickly.

TABLE OF CONTENTS:
  1. An Enhanced Ajax Approach to Active Client Pages
  2. The DOM Table
  3. The innerHTML Property
  4. The HTML OBJECT Element
  5. Summing Up
By: Chrysanthus Forcha
Rating: starstarstarstarstar / 7
October 28, 2008

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

The Store

Active Client Pages Technology needs a store. With the Ajax approach, the store is in the JavaScript in the HEAD element of the master page. Data is stored in JavaScript variables, JavaScript arrays or JavaScript object properties. These elements would constitute the store. We saw this previously. The pages come and go but data for the different pages can remain in the store in the script of the HEAD element.

Other Methods of Storing Data

JavaScript 2D Array

If your data, including the information you need in advance, is in the form of a table (perhaps from a database), you can store it in a JavaScript 2D Array. You use the for-loop when creating a 2D array. The following code creates a 2D, 6 X 4 array.


a = new Array(6)

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

{

a[i] = new Array(4)

}


HTML Table with Display Value of None

If your data, including the information you need in advance, is in the form of a table (from a database, perhaps), you can store it in an HTML Table whose value of the display property is set to "none." Your main HTML element in the master page is the DIV element. This DIV element has the HTML elements for the page and the Ajax script to download text (the page) in advance. When the value of the display property of a table or any HTML element is "none," the table does not occupy any space on the web page.

We can decide to have the DIV element, with one or more HTML tables, with the value of the display property of each of these tables set to "none." You keep your data in the cells of these tables. In the CSS normal flow, it is good to create these tables just before the DIV element of the master page. To create one of these tables, all you need to do is type the following:

<table id=“T1” style=“display:none”></table>

“T1” is the ID of the above table tag. You can use DOM features to add the rows and cells and cell contents. The DOM features you need are given below.



 
 
>>> More AJAX & Prototype Articles          >>> More By Chrysanthus Forcha
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

AJAX & PROTOTYPE ARTICLES

- Best AJAX Tutorials for Forms
- The Best AJAX Tutorials
- 8 Great Ajax Tutorials
- Using Ajax and jQuery
- Using Ajax and jQuery with HTML Forms
- Ajax.org Offers Cloud9 IDE for JavaScript
- Java Technologies Provider ICEsoft Releases ...
- Using Recaptcha in AJAX Prototype Framework ...
- Google's Closure Compiler Service API: Addit...
- Installing Google Web Toolkit: Introducing t...
- Google's Closure Compiler Service API: Displ...
- Google's Closure Compiler Service API: Deliv...
- Google's Closure Compiler Service API: the A...
- Google's Closure Compiler Service API: the S...
- Google's Closure Compiler Service API: Optim...

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: