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:
- Username - displays the usernames. In each cell a hyerplink is displayed which leads to the corresponding EditUser page.
- Email - displays the emails.
- Administrator - shows whether the user account is of the administrator role.
- Command - displays a column of "Delete" buttons. Clicking on any of them will lead to deletion of the corresponding user account.
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:
- THyperLinkColumn displays the username column. The URL is constructed according to the PHP expression specified in the DataNavigateUrlFormatString property.
- TBoundColumn displays the email column.
- TCheckBoxColumn uses checkboxes to indicate whether a user account is of role administrator.
- TButtonColumn displays a column of "Delete" buttons.
The complete page template is shown as follows:
<%@ Title="My Blog - Manage User Accounts" %>
<com:TContent ID="Main">
<h1>Manage User Accounts</h1>
<a href="<%= $this->Service->constructUrl('users.NewUser')%>">Create New User</a>
<br/>
<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
{
@param
public function onInit($param)
{
parent::onInit($param);
$this->UserGrid->DataSource=UserRecord::finder()->findAll();
$this->UserGrid->dataBind();
}
@param @param
public function deleteButtonClicked($sender,$param)
{
$item=$param->Item;
$username=$this->UserGrid->DataKeys[$item->ItemIndex];
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.
Tip:
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.