Weblabor

YAHOO.namespace ('myTemplate.table');

YAHOO.myTemplate.table = function(){
	// shortcuts
	var $E  = YAHOO.util.Event;
	var $D  = YAHOO.util.Dom;
	var $DH = YAHOO.ext.DomHelper;
	var $X  = YAHOO.ext;
		
	return {		
		inic : function (employees){
		 	// create table,tbody
			var table = $DH.append(this.id,{tag:'table',id:this.id+'_table',border:0,children: [{tag: 'tbody'}]}); 
			this.tbody = table.firstChild;
			// add first and content rows template			
			this.tableHead = new $DH.insertHtml('afterBegin',this.tbody,'<tr><th>Name</th><th>Dept.</th><th>Manager.</th></tr>');		
			this.tableRow = new $DH.Template('<tr class="row{rowNum}"><td>{name}</td><td>{dept}</td><td>{manager}</td>');
			// fill template from employees, use http://www.dustindiaz.com/basement/sugar-arrays.html 1.6 js forEach method emulation
			employees.forEach( 	function(employee,index){
					this.tableRow.append(this.tbody,{
						rowNum : index%2,
						name : employee.name,
						dept : employee.dept,
						manager: employee.manager
					})
					this.maxIndex = index;
			},this);
			// add last footer row
			this.tableFooter = new $DH.insertHtml('beforeEnd',this.tbody,'<tr><td colspan="3" style="background: rgb(204, 204, 204) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">There are '+(this.maxIndex+1)+' Employees</td></tr>');					
		}		
	}
}();
// set the source array
var employees = [
    {name: "Jimmy Corrigan", dept: "I.T.",       manager: "Pete O'Reilly"},
    {name: "Louis O'Neill",  dept: "Purchasing", manager: "Derek Mahoney"},
    {name: "Larry Murdoch",  dept: "I.T.",       manager: "Pete O'Reilly"},
    {name: "John Doe",       dept: "Sales",      manager: "Terry Dunne"}
];
// shortcut
var $E  = YAHOO.util.Event;
// set Y! onAvailable event (DOM id, inci method, inic : function (employees))
$E.onAvailable('table_wrapper',YAHOO.myTemplate.table.inic,employees);