summaryrefslogtreecommitdiff
path: root/demos/quickstart/protected/pages/Controls/DataGrid2.page
blob: a081fa46b6e27a36b4e2d8b6de9d35f8f70d9cd4 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<com:TContent ID="body" >

<h1>TDataGrid : Part II</h1>

<h2>Interacting with TDataGrid</h2>
<p>
Besides the rich data presentation functionalities as demonstrated in previous section, TDataGrid is also highly user interactive. An import usage of TDataGrid is editting or deleting rows of data. The <tt>TBoundColumn</tt> can adjust the associated cell presentation according to the mode of datagrid items. When an item is in browsing mode, the cell is displayed with a static text; when the item is in editting mode, a textbox is displayed to collect user inputs. TDataGrid provides <tt>TEditCommandColumn</tt> for switching item modes. In addition, <tt>TButtonColumn</tt> offers developers the flexibility of creating arbitrary buttons for various user interactions.
</p>
<p>
The following example shows how to make the previous book information table an interactive one. It allows users to edit and delete book items from the table. Two additional columns are used in the example to allow users interact with the datagrid: <tt>TEditCommandColumn</tt> and <tt>TButtonColumn</tt>.
</p>
<com:RunBar PagePath="Controls.Samples.TDataGrid.Sample3" />

<h2>Sorting</h2>
<p>
TDataGrid supports sorting its items according to specific columns. To enable sorting, set <tt>AllowSorting</tt> to true. This will turn column headers into clickable buttons if their <tt>SortExpression</tt> property is not empty. When users click on the header buttons, an <tt>OnSortCommand</tt> event will be raised. Developers can write handlers to respond to the sort command and sort the data according to <tt>SortExpression</tt> which is specified in the corresponding column.
</p>
<p>
The following example turns the datagrid in <a href="?page=Controls.Samples.TDataGrid.Sample2">Example 2</a> into a sortable one. Users can click on the link button displayed in the header of any column, and the data will be sorted in ascending order along that column.
</p>
<com:RunBar PagePath="Controls.Samples.TDataGrid.Sample4" />

<h2>Paging</h2>

<com:RunBar PagePath="Controls.Samples.TDataGrid.Sample5" />

<h3>Custom Paging</h3>
<com:RunBar PagePath="Controls.Samples.TDataGrid.Sample6" />

<h2>Extending TDataGrid</h2>

</com:TContent>