hello.
hum...not sure if this is what you're after, but i've developed a custom non generalized template that can be used with a listview. this nees several improvements, but i think it should be enough to get you started (i hope). unfortunatelly, implementing a template programatically is a lot harder that i initially though...
here's the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
</head>
<body>
<script type="text/javascript" src="Atlas.js">
</script>
<div style="display: none">
<table id="masterTemplate">
<tbody id="topElement">
<tr class="header">
<th>Nome</th>
<th>Idade</th>
</tr>
<tr id="itemTemplate">
<td id="idTemplate"></td>
<td id="nomeTemplate"></td>
</tr>
</tbody>
</table>
</div>
<div id="conteudo">
</div>
<script type="text/xml-script">
<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
<components>
<dataSource id="mySource" autoLoad="true">
<initialData>
[{id:1, nome:"Luis"},{id:2, nome:"Rita"},{id:3, nome:"Pedro"},{id:4, nome:"Maria"},{id:5, nome:"Raul"}]
</initialData>
</dataSource>
</components>
</page>
</script>
<script type="text/javascript">
Sys.Application.load.add( onload );
Type.registerNamespace( "LA" );
LA.Template = function( element ) {
var _element = element;
this.createInstance = function( containerElement, dataContext, instanceElementCreatedCallback, callbackContext ){
var result = new Sys.TemplateInstance();
result.instanceElement = _element.cloneNode( true );
if( dataContext != null ) {
result.instanceElement.childNodes[0].innerText = dataContext.getProperty( "id" );
result.instanceElement.childNodes[1].innerText = dataContext.getProperty( "nome" );
}
containerElement.appendChild( result.instanceElement );
return result;
}
this.initialize = function() {
if( _element.parentNode ){
_element.parentNode.removeChild( _element );
}
}
this._initializeContent = function( ctl, dataContext ) {
var lbl = new Sys.UI.Label( ctl );
var binding = new Sys.Binding();
binding.set_dataPath( "id" );
binding.set_property( "text" );
lbl.get_bindings().add( binding );
}
this.dispose = function() {
_element = null;
}
}
LA.Template.registerClass( "LA.Template", null, Sys.UI.ITemplate, Sys.IDisposable );
LA.MainTemplate = function( element ) {
var _element = element;
this.createInstance = function( containerElement, dataContext, instanceElementCreatedCallback, callbackContext ){
var result = new Sys.TemplateInstance();
result.instanceElement = _element.cloneNode( true );
if( !Sys.Application.getMarkupContext().findObject( element.id ) ) {
Sys.Application.getMarkupContext().addObject( element.id, element );
}
result.callbackResult = result.instanceElement.childNodes[0];
containerElement.appendChild( result.instanceElement );
return result;
}
this.initialize = function() {
if( _element.parentNode ){
_element.parentNode.removeChild( _element );
}
}
this.dispose = function() {
_element = null;
}
}
LA.Template.registerClass( "LA.MainTemplate", null, Sys.UI.ITemplate, Sys.IDisposable );
function onload( ) {
var list = new Sys.UI.Data.ListView( $("conteudo") );
list.set_itemTemplateParentElementId( "topElement" );
list.set_layoutTemplate( new LA.MainTemplate( $("masterTemplate") ) );
var binding = new Sys.Binding();
binding.set_dataContext( $object("mySource") );
binding.set_dataPath( "data" );
binding.set_property( "data" );
list.get_bindings().add( binding );
list.set_itemTemplate( new LA.Template( $("itemTemplate") ) );
list.initialize();
}
</script>
</body>
</html>