aspnet-115695-components-data-and-image-navigation-dataview-concepts-binding-to-data.md
The ASPxDataView control displays a set of data items organized according to the selected layout mode. To populate the control with the data items, use one of the following techniques to bind it to the data source.
Declaratively (in the markup)
Programmatically (in the code-behind)
Important
If the ASPxDataWebControl.DataSourceID property value is specified, the ASPxDataWebControlBase.DataSource property must be left blank, and vice versa. These two properties should never be set at the same time.
You can bind the ASPxDataView control to a data source control in markup. Set the ASPxDataWebControl.DataSourceID property value to the ID of the target data source control. When you assign a data source to the control at design time, a default item template for displaying data items is automatically created.
In the example below, the data view is bound to the XmlDataSource control. A custom item template is created in the markup to display XML data from the data source.
<dx:ASPxDataView runat="server" ID="DataView" DataSourceID="DataSource">
<SettingsTableLayout ColumnCount="2" RowsPerPage="2" />
<ItemTemplate>
<table>
<tr>
<td>
<dx:ASPxLabel ID="LabelText" runat="server" Text='<%# Eval("Text") %>' Font-Bold="true" />
</td>
<td>
<dx:ASPxImage ID="Image" runat="server" ImageUrl='<%# Eval("ImageUrl") %>' ShowLoadingImage="true" />
</td>
</tr>
<tr>
<td>
<dx:ASPxLabel ID="LabelDescription" runat="server" Text='<%# Eval("Description") %>' />
</td>
</tr>
</table>
</ItemTemplate>
</dx:ASPxDataView>
<asp:XmlDataSource runat="server" ID="DataSource" DataFile="~/App_Data/Charts.xml" />
You can bind the ASPxDataView control to any object that implements the IEnumerable interface: ADO.NET datasets, data readers (e.g., SqlDataReader, OleDbDataReader) and most collections.
You can bind the data view to the custom data source object. To do this, assign it as the ASPxDataWebControlBase.DataSource property value and call the ASPxWebControl.DataBind method. In this case, an item template should be created manually. In the example below, the Enumerable.Range method is used to create a custom data source. The item template is created at runtime.
<dx:ASPxDataView runat="server" ID="DataView" OnLoad="DataView_Load">
<SettingsTableLayout ColumnCount="2" RowsPerPage="2" />
</dx:ASPxDataView>
using DevExpress.Web;
using System.Collections;
using System.Drawing;
using System.Linq;
using System.Web.UI;
protected void DataView_Load(object sender, System.EventArgs e) {
DataView.DataSource = GetDataSource();
DataView.ItemTemplate = new MyDataViewTemplate();
DataView.DataBind();
}
public IEnumerable GetDataSource() {
IEnumerable dataSource = Enumerable.Range(1, 10).Select(i => new {
ID = i,
Name = "Name" + i,
Description = "Sample description for the item."
});
return dataSource;
}
Imports DevExpress.Web
Imports System.Collections
Imports System.Drawing
Imports System.Linq
Imports System.Web.UI
Protected Sub DataView_Load(ByVal sender As Object, ByVal e As System.EventArgs)
DataView.DataSource = GetDataSource()
DataView.ItemTemplate = New MyDataViewTemplate()
DataView.DataBind()
End Sub
Public Function GetDataSource() As IEnumerable
Dim dataSource As IEnumerable = Enumerable.Range(1, 10).[Select](Function(i) New With {Key
.ID = i, Key
.Name = "Name" & i, Key
.Description = "Sample description for the item."
})
Return dataSource
End Function
using DevExpress.Web;
using System.Web.UI;
public void InstantiateIn(Control container) {
var dataViewContainer = container as DataViewItemTemplateContainer;
container.Controls.Add(GetFormLayout(dataViewContainer.DataItem));
}
ASPxFormLayout GetFormLayout(object dataItem) {
var formLayout = new ASPxFormLayout();
formLayout.ID = "FormLayout";
var layoutGroup = formLayout.Items.Add(new LayoutGroup("Item Info")) as LayoutGroup;
var layoutItemName = new LayoutItem("Name");
layoutItemName.Controls.Add(new ASPxLabel() { Text = GetData(dataItem, "Name") });
var layoutItemDecsription = new LayoutItem("Description");
layoutItemDecsription.Controls.Add(new ASPxLabel() { Text = GetData(dataItem, "Description") });
layoutGroup.Items.Add(layoutItemName);
layoutGroup.Items.Add(layoutItemDecsription);
return formLayout;
}
string GetData(object dataObject, string fieldName) {
return DataBinder.Eval(dataObject, fieldName).ToString();
}
Imports DevExpress.Web
Imports System.Web.UI
Public Sub InstantiateIn(ByVal container As Control) Implements ITemplate.InstantiateIn
Dim dataViewContainer = TryCast(container, DataViewItemTemplateContainer)
container.Controls.Add(GetFormLayout(dataViewContainer.DataItem))
End Sub
Private Function GetFormLayout(ByVal dataItem As Object) As ASPxFormLayout
Dim formLayout = New ASPxFormLayout()
formLayout.ID = "FormLayout"
Dim layoutGroup = TryCast(formLayout.Items.Add(New LayoutGroup("Item Info")), LayoutGroup)
Dim layoutItemName = New LayoutItem("Name")
layoutItemName.Controls.Add(New ASPxLabel() With {.Text = GetData(dataItem, "Name")})
Dim layoutItemDecsription = New LayoutItem("Description")
layoutItemDecsription.Controls.Add(New ASPxLabel() With {.Text = GetData(dataItem, "Description")})
layoutGroup.Items.Add(layoutItemName)
layoutGroup.Items.Add(layoutItemDecsription)
Return formLayout
End Function
Private Function GetData(ByVal dataObject As Object, ByVal fieldName As String) As String
Return DataBinder.Eval(dataObject, fieldName).ToString()
End Function
When the ASPxDataView control is bound to the data source (either automatically if the ASPxDataWebControl.DataSourceID property is specified, or manually with the ASPxWebControl.DataBind method), the DataBinding event is raised. This event allows you to implement data binding logic. For example, you can call the ASPxWebControl.DataBind method before assigning a data source to the data view and use the DataBinding event handler to supply data.
After the ASPxDataView control is bound to data, the ASPxDataWebControlBase.DataBound event is raised, which notifies the control that all data binding logic is completed. You can use the ASPxDataWebControlBase.DataBound event handler to perform any required operation based on the data bound to the control.
See Also