I'm trying to use XTemplate to display Row information of a Grid:


List<User> users = new ArrayList<User>();
users.add(new User("John", "Smith"));
users.add(new User("Bob", "James"));
UserList list = new UserList(users);

XTemplate tpl = XTemplate.create(getTemplate());
tpl.applyTemplate(Util.getJsObject(list));


RowExpander expander = new RowExpander();
if (showExpand){
expander.setTemplate(tpl);
columns.add(expander);
}


Here is the code the the getTemplate():


public native String getTemplate() /*-{
return ['<p>Details: ',
'<tpl for=".">',
'<p>{#}</p>', // use current array index to autonumber
'</tpl></p>'
].join("");
}-*/;


However I'm quite new to XTemplate and that I can't seem to make it work. I just copied some source with the samples.


Basically, what I am trying to do is just to render the above `List<User>` as:


Details:
1 First Name: John - Last Name: Smith
2 First Name: Bob - Last Name: James




Here is the **User** and **UserList** models:


class User extends BaseModelData {
public User(String firstName, String lastName){
set("firstname", firstName);
set("lastname", lastName);
}
}

class UserList extends BaseModelData {
public UserList(List<User> list){
set("users", list);
}
public List getUsers(){
return get("users");
}
public void setUsers(List users) {
set("users", users);
}
}


This is how the Grid is declared:


Grid grid = new Grid<ModelData>(new ListStore<ModelData>(), new ColumnModel(columns));