function js_updateList() {	
	var height, width, depth = 0;
	
	//get height, width and depth
	height = document.getElementById("txtHeight").value;
	width = document.getElementById("txtWidth").value;
	depth = document.getElementById("txtDepth").value;
	
		
	if(height=="")height=0;
	if(width=="")width=0;
	if(depth=="")depth=0;
	
	
	AusRack.enclosures.getEnclosureList(height,width,depth,ServerSideAdd_CallBack);
	
}

function ServerSideAdd_CallBack(response){

	var o_htmlSpan = document.getElementById("enclosurelist")
    o_htmlSpan.innerHTML = "";
    
        
    //if the server side code threw an exception
	if (response.error != null)
	{    
		alert(response.error); 
		return;
	}
    
    var dsList = response.value;
    
    //if the server side code threw an exception
	if (dsList == null)
	{	
		return;
	}
    
	
	
 if(typeof(dsList) == 'object' && typeof(dsList.Tables) == 'object')
  {
        
    var listdata;    
        
    listdata = "<table id='table2' cellSpacing='1' cellPadding='1' width='500px'>";
    listdata += "<tr class='tableheader' vAlign='top' align='left'>";
    listdata += "<td class='sizetableheads' width='80'>Model Number</td>";
    listdata += "<td width='80'>";
    listdata += "<div align='center'>Height (mm)</div>";
    listdata += "</td>";
    listdata += "<td width='80'>";
    listdata += "<div align='center'>Width (mm)</div>";
    listdata += "</td>";
    listdata += "<td width='80'>";
    listdata += "<div align='center'>Depth (mm)</div>";
    listdata += "</td>";
    listdata += "<td width='160'>";
    listdata += "<div align='center'>Description</div>";
    listdata += "</td>";
    listdata += "<td width='20'>";
    listdata += "<div align='center'> Link </div>";
    listdata += "</td>";
    listdata += "</tr>";    
    
    for(var i=0; i<dsList.Tables[0].Rows.length; i++) { 
		if(i%2) {    
		listdata += "<tr class='tableline2' vAlign='top' align='left'>";
		listdata += "<td class='sizetable1' align='left'>"+ dsList.Tables[0].Rows[i].CatalogueNumber +"</td>";
		listdata += "<td  class='sizetable1'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Height + "</div>";
		listdata += "</td>";
		listdata += "<td  class='sizetable1'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Width + "</div>";
		listdata += "</td>";
		listdata += "<td class='sizetable1'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Depth + " </div>";
		listdata += "</td>";
		listdata += "<td class='sizetable1'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Description + "</div>";
		listdata += "</td>";
		listdata += "<td class='sizetable1'>";
		listdata += "<div align='center'><a href='" + dsList.Tables[0].Rows[i].Link + "'><img src='datasheet.gif' border=0></a></div>";
		listdata += "</td>";
		listdata += "</tr>";
		}
		else {
		listdata += "<tr class='bodytext' vAlign='top' align='left'>";
		listdata += "<td class='sizetable2' align='left'>"+ dsList.Tables[0].Rows[i].CatalogueNumber +"</td>";
		listdata += "<td  class='sizetable2'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Height + "</div>";
		listdata += "</td>";
		listdata += "<td  class='sizetable2'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Width + "</div>";
		listdata += "</td>";
		listdata += "<td class='sizetable2'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Depth + "</div>";
		listdata += "</td>";
		listdata += "<td class='sizetable1'>";
		listdata += "<div align='center'>" + dsList.Tables[0].Rows[i].Description + "</div>";
		listdata += "</td>";
		listdata += "<td class='sizetable1'>";
		listdata += "<div align='center'><a href='" + dsList.Tables[0].Rows[i].Link + "'><img src='datasheet.gif' border=0></a></div>";
		listdata += "</td>";
		listdata += "</tr>";
		}
     }
     
     listdata += "</table>"; 
     
     
     o_htmlSpan.innerHTML = listdata;
      
   }   
   
}