The list View
Here is where we start to get into the power of Dojo. We will use a grid display for the data we've prepared.
This is the view script (template) for users, stored in /modules/admin/view/users/index.phtml. View scripts are functionally identical to php files, except they are insulated from being called directly by their odd suffix. Instead they are decorated by the view manager. Note much of this file is basic HTML markup -- once you get past the setup header which is boilerplate you will be copying from one Dojo-enabled view to another routinely.
Zend_Dojo_View_Helper_Dojo::setUseDeclarative();
$this->dojo()->setLocalPath('/js/dojo/dojo.js')
->addStylesheet('/js/dojox/grid/_grid/tundraGrid.css')
->requireModule('dojo.data.ItemFileReadStore')
->requireModule('dojox.grid.Grid');
?>
<!-- DOJO member grid -->
<span dojoType="dojo.data.ItemFileReadStore" jsId="memberStore"
url="/admin/users/data" > </span>
<table id="dojo_members" dojoType="dojox.grid.Grid" store="memberStore"
clientSort="true" query="{id: '*'}" style="height:100em; width:60em">
<script type="dojo/method" event="onSelected" args="inRowIndex">
var row = this.model.getRow(inRowIndex);
document.location = '/admin/users/view/id/' + row['id'];
</script>
<thead>
<tr>
<th field="id" width="3em">ID</th>
<th field="name" style="width: 20em">Name</th>
<th field="username">Username</th>
<th field="email">E-Mail</th>
</tr>
</thead>
</table>
Note that other than keeping the headline fieldnames keyed to the schema, there's very little you need to know in order to render a useful grid. The colums will click-sort, and there is a simple click-trigger will jump you to a view page. You can quickly manipulate the view by setting standard width properties or reordering the headers.
Summary
This is the end of the example, as far as it goes -- I hope to extend the example with more interactive grid/form detail, but even this limited example shows how you can essentially "dump" out raw data and geta quick list view for it that requires very little effort and can be easlly maintained.

Post new comment