ListSorter demo

Description
This page displays a ListSorter component, with state submitted with the Ajax support.
Notice the save button, calling the JavaScript component API.
This list still have to be enclosed inside a form.


In Action

  • John Smith, 34 years old
  • Paul Carter, 58 years old
  • Simon Carpenter, 18 years old
  • Jill Valent, 24 years old


Refresh this page : state have been saved



TML Source code

		<t:form>
			<br/>
			
			<ex:listSorter t:id="ls" source="list" value="element">
				${element.firstName } ${element.lastName }, ${element.age } years old
			</ex:listSorter>		
			<input type="button" value="Ajax save" onclick="ls.save()"/><br/><br/>
			
			<t:pagelink page="components/listSorter/example2">Refresh this page </t:pagelink>: state have been saved
		</t:form>
	



Java code

	public class Example2
	{
	    @Persist
	    @Property
	    private List<User> list;
	
	    @Property
	    private User element;
	
	    void onActivate()
	    {
		    if(list == null){
				list = new ArrayList<User>();
		        list.add(new User(1, "John", "Smith", 34));
		        list.add(new User(1, "Paul", "Carter", 58));
		        list.add(new User(1, "Simon", "Carpenter", 18));
		        list.add(new User(1, "Jill", "Valent", 24));
		    }
	    }
	}