[ DWR Website | Web Application Index ]

DWR + Dojo Demo

Name Address Age Superhero?

   

Server Side

Our dwr.xml configuration contains a creator for the People class.

<!-- people -->
<create creator="new" scope="application">
  <param name="class" value="com.example.dwr.people.People"/>
  </create>
				

In the constructor for People we create a MapStoreDataProvider and register it in the Directory.

/**
 * Pre-populate the small and large crowds
 */
 public People()
 {
   smallCrowd = createCrowd(10);
   MapStoreProvider<Person> provider = new MapStoreProvider<Person>(createCrowd(1000), Person.class);
   Directory.register("largeCrowd", provider);
   largeCrowd = provider.asMap();
 }
				

Client Side

Our Dojo Grid is declared using the following markup:

<table id="grid" dojoType="dojox.grid.DataGrid">
  <thead>
	<tr>
	  <th field="name" width="120px" editable="true">Name</th>
	  <th field="address" width="200px" editable="true">Address</th>
	  <th field="age" width="30px" editable="true">Age</th>
	  <th field="superhero" width="30px" editable="true">Superhero?</th>
	</tr>
  </thead>
</table>
				

All that's needed to initialize this is the following:

var dwrStore, grid;
dojo.addOnLoad(function() {
  dwrStore = new dwr.data.Store("largeCrowd", { subscribe:true });
  grid = dijit.byId("grid");
  grid.setStore(dwrStore);
  dwr.engine.setActiveReverseAjax(true);
});
				

Here we create a new Store passing it the name of our Provider (from People.java). The DwrStore implements dojo.data.api.Notification but will only send updates if subscribe=true. The updates will be sent in a timely manner if dwr.engine.setActiveReverseAjax=true.