The cool thing about the Preview area of the data row, is that you can place anything there. For example you can place a simple text or an image and data bind it to the current DataContext, which is in fact your data row object. So if you have another AgDataGrid inside your preview template, you can bind it's DataSource to the current DataContext.
So if, our master grid is bound to a collection of customer objects and each customer has a list of orders.
public class Order {
public int OrderId { get; set; }
public string Description { get; set; }
public decimal Price { get; set; }
}
public class Customer {
public string Name { get; set; }
public string Country { get; set; }
private List<Order> _orders = new List<Order>();
public List<Order> Orders { get { return this._orders; } }
}
List<Customer> GetCustomers() {
Customer c;
List<Customer> list = new List<Customer>();
c = new Customer() { Name = "Joe", Country = "USA" };
c.Orders.Add(new Order() { OrderId = 0, Description = "Sterio", Price=2000 });
c.Orders.Add(new Order() { OrderId = 1, Description = "XP Radio", Price=1000 });
c.Orders.Add(new Order() { OrderId = 2, Description = "Cell Phone", Price=200 });
list.Add(c);
c = new Customer() { Name = "Bill", Country = "USA" };
c.Orders.Add(new Order() { OrderId = 3, Description = "Sterio", Price=2000 });
c.Orders.Add(new Order() { OrderId = 4, Description = "Head Set", Price=100 });
c.Orders.Add(new Order() { OrderId = 5, Description = "Keyboard", Price=100 });
list.Add(c);
return list;
}
then the Customer.Orders could be bound to a DataSource of the grid that is inside the preview row like so:
<DevExpress:AgDataGrid
x:Name="dataGrid" PreviewVisibility="ForAllRows"
ColumnsAutoWidth="True" ShowGroupPanel="Visible">
<DevExpress:AgDataGrid.Columns>
<DevExpress:AgDataGridColumn FieldName="Name"></DevExpress:AgDataGridColumn>
<DevExpress:AgDataGridColumn FieldName="Country"></DevExpress:AgDataGridColumn>
</DevExpress:AgDataGrid.Columns>
<DevExpress:AgDataGrid.PreviewTemplate>
<DataTemplate>
<Grid Height="180">
<DevExpress:AgDataGrid AutoGenerateColumns="True"
DataSource="{Binding Orders}" ColumnsAutoWidth="True" Margin="5">
</DevExpress:AgDataGrid>
</Grid>
</DataTemplate>
</DevExpress:AgDataGrid.PreviewTemplate>
</DevExpress:AgDataGrid>
Cheers,
Azret