Parent/Child conception can be easly implemented with RowExpander and Associations
One to one
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
PersonsStore.Data = this.Persons;
}
public List<Person> Persons
{
get
{
return new List<Person>
{
new Person(1, "John Smith", new Address(1, "1", "Cross Street 11/1", "Big City", "123456" )),
new Person(2, "Jane Brown", new Address(2, "2", "Cross Street 12/2", "Big City", "654321" )),
new Person(3, "Kevin Jones", new Address(3, "3", "Cross Street 13/3", "Big City", "321654" ))
};
}
}
public class Address
{
public Address(int id, string number, string street, string city, string zip)
{
this.Id = id;
this.Number = number;
this.Street = street;
this.City = city;
this.Zip = zip;
}
public int Id
{
get;
private set;
}
public string Number
{
get;
private set;
}
public string Street
{
get;
private set;
}
public string City
{
get;
private set;
}
public string Zip
{
get;
private set;
}
}
public class Person
{
public Person(int id, string name, Address address)
{
this.Id = id;
this.Name = name;
this.Address = address;
}
public int Id
{
get;
private set;
}
public string Name
{
get;
private set;
}
public Address Address
{
get;
private set;
}
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Simple HasOne Association - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
</head>
<body>
<ext:ResourceManager runat="server" />
<h1>Simple HasOne Association</h1>
<ext:Model runat="server" Name="Address" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Number" />
<ext:ModelField Name="Street" />
<ext:ModelField Name="City" />
<ext:ModelField Name="Zip" />
</Fields>
</ext:Model>
<ext:Store ID="PersonsStore" runat="server">
<Model>
<ext:Model runat="server" Name="Person" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Name" />
</Fields>
<Associations>
<ext:HasOneAssociation Model="Address" AssociationKey="Address" />
</Associations>
</ext:Model>
</Model>
</ext:Store>
<ext:GridPanel
runat="server"
StoreID="PersonsStore"
Title="Persons with RowExpander"
Width="500"
Height="250">
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="Name" DataIndex="Name" Flex="1" />
</Columns>
</ColumnModel>
<Plugins>
<ext:RowExpander runat="server" SingleExpand="false">
<Component>
<ext:FormPanel
runat="server"
BodyPadding="5">
<Items>
<ext:DisplayField runat="server" FieldLabel="ID" Name="Id" />
<ext:DisplayField runat="server" FieldLabel="Number" Name="Number" />
<ext:DisplayField runat="server" FieldLabel="Street" Name="Street" />
<ext:DisplayField runat="server" FieldLabel="City" Name="City" />
<ext:DisplayField runat="server" FieldLabel="Zip" Name="Zip" />
</Items>
<Listeners>
<AfterRender Handler="this.record.getAddress(function(address){this.getForm().loadRecord(address);}, this);" />
</Listeners>
</ext:FormPanel>
</Component>
</ext:RowExpander>
</Plugins>
</ext:GridPanel>
</body>
</html>
One to many
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
Store1.Data = this.Users;
}
public List<User> Users
{
get
{
return new List<User>
{
new User(1, "User1", new List<Product>{
new Product(1, "Product1 of User1"),
new Product(2, "Product2 of User1"),
new Product(3, "Product3 of User1")
}),
new User(2, "User2", new List<Product>{
new Product(4, "Product1 of User2"),
new Product(5, "Product2 of User2"),
new Product(6, "Product3 of User2")
}),
new User(3, "User3", new List<Product>{
new Product(7, "Product1 of User3"),
new Product(8, "Product2 of User3"),
new Product(9, "Product3 of User3")
})
};
}
}
public class Product
{
public Product(int id, string name)
{
this.Id = id;
this.Name = name;
}
public int Id
{
get;
private set;
}
public string Name
{
get;
private set;
}
}
public class User
{
public User(int id, string name, List<Product> products)
{
this.Id = id;
this.Name = name;
this.Products = products;
}
public int Id
{
get;
private set;
}
public string Name
{
get;
private set;
}
public List<Product> Products
{
get;
private set;
}
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Simple HasMany Association - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
</head>
<body>
<ext:ResourceManager runat="server" />
<h1>Simple HasMany Association</h1>
<ext:Model runat="server" Name="Product" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
</ext:Model>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server" Name="User" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
<Associations>
<ext:HasManyAssociation Model="Product" Name="products" AssociationKey="Products"/>
</Associations>
</ext:Model>
</Model>
</ext:Store>
<ext:GridPanel
runat="server"
StoreID="Store1"
Title="Users with RowExpander"
Width="500"
Height="250">
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="Name" DataIndex="Name" Flex="1" />
</Columns>
</ColumnModel>
<Plugins>
<ext:RowExpander runat="server" SingleExpand="false">
<Component>
<ext:GridPanel
runat="server"
Title="Products">
<Store>
<ext:Store runat="server" ModelName="Product" />
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="Name" DataIndex="Name" Flex="1" />
</Columns>
</ColumnModel>
<Listeners>
<AfterRender Handler="this.bindStore(this.record.products());" />
</Listeners>
</ext:GridPanel>
</Component>
</ext:RowExpander>
</Plugins>
</ext:GridPanel>
</body>
</html>
We updated Association examples in SVN to demonstrate associations with RowExpander