Skip to main content

TabControl - Data Binding to an XML file via property settings

This sample demonstrates how to bind the ASPxTabControl to an XML data file. XML data are retrieved from the file via an XmlDataSource component whose XPath property is specifically defined. The XmlDataSource is used as a data source for the ASPxTabControl.Based on the source data, the ASPxTabControl populates its Tabs collection with automatically created Tab objects. Tab object characteristics (such as text, image, navigate location, tooltip text, etc) are obtained from the data source's data fields (node attributes).In this demo, the required data fields (node attributes) from which to retrieve tab data are indicated using the following specific data-related properties of the ASPxTabControl:ActiveTabImageUrlField,NameField,NavigateUrlField,TabImageUrlField, TextField and ToolTipField.

For more information about these properties see:

View Example

<dx:ASPxTabControl ID="ASPxTabControl1" runat="server" 
    ActiveTabImageUrlField="ActiveTabImage" DataSourceID="XmlDataSource1" 
    NameField="ID" NavigateUrlField="Link" TabImageUrlField="Image" 
    TextField="Caption" ToolTipField="Hint">
</dx:ASPxTabControl>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" 
    DataFile="~/App_Data/TabControlDataSource_manual.xml" XPath="platforms/*">
</asp:XmlDataSource>
<?xml version="1.0" encoding="utf-8" ?>
<platforms>
    <platform ID="WinForms" Link="javascript: void(0);" Image="~/Images/WinForms_ini.png" ActiveTabImage="~/Images/WinForms_Active.png" Caption="WinForms Controls" Hint="WinForms Controls and Libraries"></platform>
    <platform ID="ASP" Link="javascript: void(1);" Image="~/Images/ASP_ini.png" ActiveTabImage="~/Images/ASP_Active.png" Caption="ASP.NET Controls" Hint="ASP.NET Controls and Libraries"></platform>
    <platform ID="VCL" Link="http://devexpress.com/Products/VCL/" Image="~/Images/VCL_ini.png" ActiveTabImage="~/Images/VCL_Active.png" Caption="Delphi VCL Controls" Hint="Delphi and C++ Builder Controls"></platform>
</platforms>