Prototype: Easing AJAX's Pain
by Bruce Perry
|
Pages: 1, 2, 3, 4
Delegator
Our own CO2Levels object uses the concept of delegation, wherein calls to its own keys(), values(), and add() methods delegate the real work of these operations to the internal Hash object. This object is stored as a local variable: levelsHash.
Let's look at the getYear() method.
getYear: function(year){
if (! isNaN(year)) {
return this.levelsHash[year];
} else {
return 377;
}
}
The built-in JavaScript method isNaN() returns false if its parameter can be evaluated as a number (such as "2000"), and true otherwise (as in isNaN("hello")). If the getYear() parameter passes this test, then the code uses a common JavaScript expression to return the value of a key or property: this.levelsHash[year] (for example, this.levelsHash["2004"] evaluates to 377.38). The browser then displays this numerical value inside the HTML div element.
Add Stuff to an Existing Hash
The CO2Levels object has an add() method, which can add new keys and values (additional years and CO2 levels) to the existing data.
add: function(year,level){
var tmp = new Object();
tmp[year] = level;
this.levelsHash=this.levelsHash.merge(tmp);
}
This method creates a new Object from its two parameters (representing the year and CO2 level), which might look like: {"2005":381}
The code then passes this object to the Prototype Hash object's merge() method. This method combines the new object with the Hash's existing data, essentially merging them into one group of data or associative array.
The merge() method returns the existing data with the new property/value pair(s) appended to the end.
With some refactoring, the code could use XMLHttpRequest to fetch any new levels from the Mauna Loa Observatory, then add them to our existing client-side data.
Inspect
Finally, Prototype's Hash object also has an inspect() method. This method creates a readable display of the Hash's contents, as in Figure 1-3.

Figure 1-3. Looking inside a Hash
The CO2Levels object delegates the task of its own inspect() method to its internal Prototype Hash object.
inspect: function(){
alert( this.levelsHash.inspect());
}
This is a useful debugging tool for viewing the current contents of a Hash object.
An upcoming article discusses an AJAX caching strategy used with the same application. It introduces Prototype's Ajax.Request object, which reduces the amount of code that has to be devoted to using the XMLHttpRequest object. This is the important top-level JavaScript object used in AJAX applications for making HTTP connections with a server behind the scenes.
Share your experience in our forums.
(* You must be a member of XML.com to use this feature.)
Comment on this Article
| Titles Only | Titles Only | Newest First |
- Why Prototype?
2006-12-15 17:20:42 magnets [Reply]
I simply do not understand why anyone would want to use Prototype. There is close to 1800 lines of javascript code in Prototype. I've written entire AJAX ecommerce websites with less javascript code.
Basically use the object and store the result using innerHTML. What could be more simple?
You don't even need acceptance of an Open Source license since it is just your own Javascript.
There is an example at httpcssphp.com but that is even more complex than my code.
- How do I add private methods?
2006-11-22 06:36:01 Raphael.Stolt [Reply]
I am still in the dark on how I define method to/in an private scope?
I tried to play around with the following source but couldn't get to work.
Any hint or better a solution would be appreciated and solve for me another part in the javascript 'puzzle'.
var Headline = Class.create();
Headline.prototype = {
initialize: function() {
this.responseText = '';
this.isAtttachedUploadRemoved = false;
},
getResponseText: function () {
if(this.isAttachedUploadRemoved) {
return this.responseText;
}
},
removeAttachedUpload: function(uploadId, headlineId) {
alert('Call to remove method with '+ uploadId + ' ' + headlineId);
this.setAttachedUploadRemoveStatus(true);
this.responseText = 'blah 2006';
},
/** this method should be private
* so I can make private calls i.e. in the removeAttachedUpload method and not from the
* outer scope
*/
setAttachedUploadRemoveStatus: function (status) {
this.isAtttachedUploadRemoved = status;
}
}
- How do I add private methods?
2006-11-22 08:58:26 bwp [Reply]
See this really good article on mimicking private access specifiers in JavaScript:
http://www.crockford.com/javascript/private.html
Cheers.
- How do I add private methods?
- why the Hash object?
2006-04-26 11:44:06 schvenk [Reply]
Is there any advantage to the Prototype Hash object beyond the keys, values, and inspect methods? Hashing is inherent in basic JS objects...wouldn't using something like Hash incur unnecessary overhead?
- why the Hash object?
2006-04-27 06:10:54 bwp [Reply]
Prototype's Hash object also has convenient merge() and toQueryString() methods. This article shows the merge() method. Here's a link to an excellent reference to the Hash object:
http://www.sergiopereira.com/articles/prototype.js.html#Reference.Hash
You can pass a JS object as a parameter to the $H() Prototype method; the return value is one of these hash objects. At the very least, Prototype saves the development/debugging time associated with creating your own hash utility object.
- why the Hash object?
2006-04-11 10:59:13 jjones3535 [Reply]
- New innovations make these primitive libraries obsolete
2006-04-11 09:39:54 saym [Reply]
Check out the process to “Loosely Couple” GUI Components build online applications:
http://cbsdf.com/technologies/misc-docs/CF-LC-Figures.htm
Sample GUI components and component hierarchies:
http://cbsdf.com/technologies/demo-links/demo-links.htm
Wish to create your own components:
http://cbsdf.com/technologies/GUI-class1.htm
A sample Airplane GUI component:
http://cbsdf.com/technologies/GUI-class3.htm
A sample application:
http://www.cbsdf.com/technologies/jsp/atc_test1a.jsp
- New innovations make these primitive libraries obsolete
2006-06-20 21:53:55 mohanrao_gs [Reply]
Guys Be Informed..
Cbsdf.com is back with a new Ajax FRAUD !!!
I am unable to understand what Raju and cbsdf guys
are trying this time.But few years back these guys
frauded (rigged) the XML-J 2002 awards and stole
it from OpenOffice, ( Cocoon and Batik as well).
Back then the company name was Elansoft and
product was Agileblox
http://marc.theaimsgroup.com/?l=xml-cocoon-users&m=104875540622555&w=2
The below is an old google cached page
http://66.102.7.104/search?q=cache:fdWESVpaqC8J:weblog.halogenlabs.com/%3Fp%3D86+Elansoft+cocoon&hl=en&gl=in&ct=clnk&cd=1&client=firefox-a
For this and other business malpractices and
sleaze, a complaint was lodged with FBI and
Elansoft closed US office and ran from the law.
http://forum.java.sun.com/thread.jspa?forumID=45&threadID=182966
http://www.zdnetasia.com/builder/program/dev/talkback.htm?PROCESS=show&ID=20024225&AT=39062710-39000408_39000406_39000407_39000409_39000410_39000412_39000411_39000413_39000404_39000400_39000402_39000401_39000403_39000405c
I feel, since they escaped FBI last time so
easily, they are trying to do it once again
- New innovations make these primitive libraries obsolete
2006-08-30 20:54:32 chiluvuri1 [Reply]
Today I found this above allegation and please let me respond. The Mohan is an incompetent Crook. He is a coward using alias name. This guy cannot compete with our innovative technology, resort to illegal methods.
Mohan, we have invented next generation technologies:
http://www.cbsdf.com/ep.htm (http://www.cbsdf.com/ep.htm) .
If you are competent, just prove our technology wrong:
http://www.cbsdf.com/misc_docs/Can-u-prove.htm (http://www.cbsdf.com/misc_docs/Can-u-prove.htm) .
Just because my name is Raju and Elansoft’s CEO name is also Raju, he finds a connection. Names such as Raju or Reddy are quite common in India. Millions of people have these names. If one John commits murder, this stupid guy blames that on his nice neighbor John, because this crook’s wife finds him nice, attractive and successful. This kind of crocked tactics show what kind of jerk he is.
This alleged incidence happened in Sep’2000. Due to disputes, I have left Elansoft in Sep’2001, a full year before alleged incident and not spoken to the Elansoft management ever since. If you are not a crock, provide any evidence contradicting this. You are a coward, but I will track you and I take legal action against you for the criminal acts.
- New innovations make these primitive libraries obsolete
- New innovations make these primitive libraries obsolete
2006-06-20 21:52:21 mohanrao_gs [Reply]
Guys Be Informed..
Cbsdf.com is back with a new Ajax FRAUD !!!
I am unable to understand what Raju and cbsdf guys are trying this time.But few years back these guys frauded (rigged) the XML-J 2002 awards and stole it from OpenOffice, ( Cocoon and Batik as well).
Back then the company name was Elansoft and product was Agileblox
http://marc.theaimsgroup.com/?l=xml-cocoon-users&m=104875540622555&w=2
The below is an old google cached page
http://66.102.7.104/search?q=cache:fdWESVpaqC8J:weblog.halogenlabs.com/%3Fp%3D86+Elansoft+cocoon&hl=en&gl=in&ct=clnk&cd=1&client=firefox-a
For this and other business malpractices and sleaze, a complaint was lodged with FBI and Elansoft closed US office and ran from the law.
http://forum.java.sun.com/thread.jspa?forumID=45&threadID=182966
http://www.zdnetasia.com/builder/program/dev/talkback.htm?PROCESS=show&ID=20024225&AT=39062710-39000408_39000406_39000407_39000409_39000410_39000412_39000411_39000413_39000404_39000400_39000402_39000401_39000403_39000405c
I feel, since they escaped FBI last time so easily, they are trying to do it once again
- New innovations make these primitive libraries obsolete
2006-04-11 13:04:29 jacquescrocker1 [Reply]
Are those links a joke?
I've never seen so many arrows in my life.
- New innovations make these primitive libraries obsolete
2006-04-11 12:44:57 housel [Reply]
If you want to advertise your proprietary solutions, using loaded words like "primitive" and "obsolete" doesn't do much to impress us, especially people who prefer open-source solutions such as Prototype.
- New innovations make these primitive libraries obsolete
