Data View Elements
- 3 minutes to read
This topic describes the ASPxDataView elements visible on screen. Each section contains a screenshot, and a brief overview of the element’s function. Additionally, each topic contains a list of settings that specify the element’s layout, content and appearance.
The following visual elements are available:
Content Area
A Content Area is the main element of the data view control that displays database field contents. It may contain text labels, image boxes and other child controls or HTML elements.
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristics | Members |
|---|---|
| Appearance | ASPxDataViewBase.ContentStyle |
| Layout | DataViewSettings.Layout, DataViewTableLayoutSettings.RowsPerPage, DataViewTableLayoutSettings.ColumnCount, DataViewDivBasedLayoutSettings.ItemsPerPage |
| Data Item | DataViewItem.DataItem |
| Template | ASPxDataView.ItemTemplate |
Data Item
A Data Item displays the data field of the bound data source in the control’s content area.
You can edit the data view control’s template at design time, or use the ASPxDataView.ItemTemplate property, to customize the DataViewItem.
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristics | Members |
|---|---|
| Style | ASPxDataViewBase.ItemStyle |
| Spacing | ASPxDataViewBase.ItemSpacing |
Empty Data Area
The Empty Data Area is displayed within the ASPxDataView control when the control’s content is empty, as shown below:
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristics | Members |
|---|---|
| Text | ASPxDataViewBase.EmptyDataText |
| Template | ASPxDataViewBase.EmptyDataTemplate |
| Style | ASPxDataViewBase.EmptyDataStyle |
Loading Panel
The Loading Panel is displayed within the ASPxDataView control while waiting for a callback response, as shown below:
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristic | Members |
|---|---|
| Delay | SettingsLoadingPanel.Delay |
| Visibility | SettingsLoadingPanel.Enabled |
| Text | SettingsLoadingPanel.Text |
| Image | SettingsLoadingPanel.ShowImage, SettingsLoadingPanel.ImagePosition, ASPxDataViewBase.LoadingPanelImage |
| Style | ASPxDataViewBase.LoadingPanelStyle |
Pager
A Pager element allows users to navigate through the control’s data pages. It consists of “next”, “last”, “previous”, and “first” buttons, and an indicator that displays the current page number and the total number of pages. The Pager element is placed onto a Pager Panel.
The Pager can be attached to the top, bottom or both sides of the DataView control.
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristics | Members |
|---|---|
| Alignment | ASPxDataViewBase.PagerAlign |
| General Settings | ASPxDataView.PagerSettings |
| Endless Paging Mode | DataViewPagerSettings.EndlessPagingMode |
| Style | ASPxDataViewBase.PagerStyle |
Pager Panel
A Pager Panel element is a panel to which a Pager control element is attached.
The table below lists the main members that affect the element’s appearance and functionality:
| Characteristics | Members |
|---|---|
| Style | ASPxDataViewBase.PagerPanelStyle |
| Spacing (distance to the content area) | ASPxDataViewBase.PagerPanelSpacing |
Pager UI Elements
The pager includes a set of UI elements that allow end users to navigate through data. The image below shows the available UI elements.
The following table lists members that are related to the functionality and appearance of the pager UI elements.
Elements | Appearance | Settings |
|---|---|---|
Numeric Buttons | PagerSettingsEx.ShowNumericButtons | |
Current Page Number | ||
Separators | — | |
All Button | ||
Page Size Item | ||
Summary | ||
Navigation Buttons (First, Previous, Next, Last) | PagerSettingsEx.FirstPageButton PagerSettingsEx.PrevPageButton |