Creating AdminUser Page

The AdminUser page displays all user accounts in a list so that the administrator can perform some administrative work. For simplicity, the administrative work our blog system supports include editting a user account and deleting a user account.

We will display the user list in a table. Each row of the table represents a single user account, and the following columns are to be displayed:

We create two files protected/pages/users/AdminUser.page and protected/pages/users/AdminUser.php to save the page template and page class, respectively.

Creating Page Template

We use TDataGrid to display the user accounts. Based on the above analysis, we configure the following four columns:

The complete page template is shown as follows:

<%@ Title="My Blog - Manage User Accounts" %> <com:TContent ID="Main">

Manage User Accounts

Create New User
<com:TDataGrid ID="UserGrid" DataKeyField="username" AutoGenerateColumns="false" OnDeleteCommand="deleteButtonClicked"> <com:THyperLinkColumn HeaderText="Username" DataTextField="username" DataNavigateUrlField="username"> <prop:DataNavigateUrlFormatString># $this->Service->constructUrl('users.EditUser',array('username'=>{0})) </prop:DataNavigateUrlFormatString> </com:THyperLinkColumn> <com:TBoundColumn HeaderText="Email" DataField="email" /> <com:TCheckBoxColumn HeaderText="Administrator" DataField="role" /> <com:TButtonColumn HeaderText="Command" Text="Delete" ButtonType="PushButton" CommandName="delete" /> </com:TDataGrid> </com:TContent>

Creating Page Class

In the above page template, the datagrid's OnDeleteCommand event is ttached with the method deleteButtonClicked() which we shall implement in the page class. In addition, the datagrid needs to be populated with user accounts data when the page is initialized. Therefore, we write the page class as follows:

class AdminUser extends TPage { /** * Populates the datagrid with user lists. * This method is invoked by the framework when initializing the page * @param mixed event parameter */ public function onInit($param) { parent::onInit($param); // fetches all data account information $this->UserGrid->DataSource=UserRecord::finder()->findAll(); // binds the data to interface components $this->UserGrid->dataBind(); } /** * Deletes a specified user record. * This method responds to the datagrid's OnDeleteCommand event. * @param TDataGrid the event sender * @param TDataGridCommandEventParameter the event parameter */ public function deleteButtonClicked($sender,$param) { // obtains the datagrid item that contains the clicked delete button $item=$param->Item; // obtains the primary key corresponding to the datagrid item $username=$this->UserGrid->DataKeys[$item->ItemIndex]; // deletes the user record with the specified username primary key UserRecord::finder()->deleteByPk($username); } }

In the above, the deleteButtonClicked() method is invoked whenever a "Delete" button is clicked. To determine which row of the buttons is clicked, we check the Item.ItemIndex property of the event parameter. To further identify which user account is to be deleted, we retrieve the primary key (username) value via the datagrid's DataKeys property.

All data-bound controls have similar usage pattern. That is, set the DataSource property with the data and call dataBind() method to binds the data to the control's internal structure.

Testing

To test the AdminUser page, visit the URL http://hostname/blog/index.php?page=users.AdminUser. You may be required to login as an administrator first if you have not done so. We shall expect to see the following result.