What's New?

[CLOSED] Bind editor to nested class collection

  1. #1
    Apr 30, 2011, 3:32 PM

    [CLOSED] Bind editor to nested class collection

    I have a class with a class collection as one of its properties. I would like to bind the main class to a gridpanel, and the class collection to an editor on in one of the grid columns. How do I do this? I started a sample to show what I'm trying to accomplish:

    <%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Import Namespace="System.Collections.Generic" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        List<Customer> list = new List<Customer>(5);
 
        for (int i = 1; i <= 5; i++)
        {
            Customer customer = new Customer
                                    {
                                        ID = i,
                                        FirstName = ("FirstName" + i),
                                        LastName = ("LastName" + i),
                                        Company = ("Company" + i),
                                        Orders = new List<Order>()
                                    };

            for (int o = 1; o <= 3; o++)
            {
                Order order = new Order
                                {
                                    OrderId = i * o,
                                    ItemDescription = String.Format("Item {0}{1}", i, o)
                                };

                customer.Orders.Add(order);
            }
 
            list.Add(customer);
        }
 
        Store1.DataSource = list;
        Store1.DataBind();
    }
 
 
    public class Customer
    {
        public int ID { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Company { get; set; }
        public List<Order> Orders { get; set; }
    }
 
    public class Order
    {
        public int OrderId { get; set; }
        public string ItemDescription { get; set; }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Store runat="server" ID="Store1" AutoLoad="true">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="ID" Type="Int" />
                        <ext:RecordField Name="FirstName" />
                        <ext:RecordField Name="LastName" />
                        <ext:RecordField Name="Company" />
                        <ext:RecordField Name="Orders" IsComplex="true" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
         
         <ext:GridPanel
            ID="GridPanel1"
            runat="server"
            Title="Customers"
            Height="300"
            StoreID="Store1">
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column Header="ID" DataIndex="ID" />
                    <ext:Column Header="FirstName" DataIndex="FirstName"  />
                    <ext:Column Header="LastName" DataIndex="LastName" />
                    <ext:Column Header="Company" DataIndex="Company" />           
                    <ext:Column Header="Select Order">
                        <Editor>
                            <ext:ComboBox 
                                ID="OrderSelection" 
                                runat="server" 
                                DisplayField="ItemDescription" 
                                ValueField="OrderId" />
                        </Editor>
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <LoadMask ShowMask="true" />
        </ext:GridPanel> 
    </form>
</body>
</html>
    Last edited by Daniil; May 02, 2011 at 8:05 PM. Reason: [CLOSED]
  2. #2
    May 01, 2011, 10:30 PM
    Hi,

    Please investigate the sample.

    Example
    <%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Import Namespace="System.Collections.Generic" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        List<Customer> list = new List<Customer>(5);
  
        for (int i = 1; i <= 5; i++)
        {
            Customer customer = new Customer
                                    {
                                        ID = i,
                                        FirstName = ("FirstName" + i),
                                        LastName = ("LastName" + i),
                                        Company = ("Company" + i),
                                        Orders = new List<Order>(),
                                        CurrentOrder = i * 1
                                    };
 
            for (int o = 1; o <= 3; o++)
            {
                Order order = new Order
                                {
                                    OrderId = i * o,
                                    ItemDescription = String.Format("Item {0}{1}", i, o)
                                };
 
                customer.Orders.Add(order);
            }
  
            list.Add(customer);
        }
  
        Store1.DataSource = list;
        Store1.DataBind();
    }
  
  
    public class Customer
    {
        public int ID { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Company { get; set; }
        public List<Order> Orders { get; set; }
        public int CurrentOrder { get; set; }
    }
  
    public class Order
    {
        public int OrderId { get; set; }
        public string ItemDescription { get; set; }
    }
</script>
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Ext.Net Example</title>
    
    <script type="text/javascript">
        var orderRenderer = function (value, metadata, record) {
            Ext.each(record.data.Orders, function (order) {
                if (value === order.OrderId) {
                    value = order.ItemDescription;
                    return false;
                }
            });
            return value;
        }
        
        var onBeforeStartEdit = function (editor, boundEl, value) {
            editor.field.store.loadData(editor.record.data.Orders);
        }
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
         
        <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="ID" Type="Int" />
                        <ext:RecordField Name="FirstName" />
                        <ext:RecordField Name="LastName" />
                        <ext:RecordField Name="Company" />
                        <ext:RecordField Name="Orders" IsComplex="true" />
                        <ext:RecordField Name="CurrentOrder" Type="Int" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        
        <ext:Store ID="Store2" runat="server">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="OrderId" Type="Int" />
                        <ext:RecordField Name="ItemDescription" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
          
         <ext:GridPanel
            runat="server"
            Title="Customers"
            Height="300"
            StoreID="Store1">
            <ColumnModel  runat="server">
                <Columns>
                    <ext:Column Header="ID" DataIndex="ID" />
                    <ext:Column Header="FirstName" DataIndex="FirstName"  />
                    <ext:Column Header="LastName" DataIndex="LastName" />
                    <ext:Column Header="Company" DataIndex="Company" />           
                    <ext:Column Header="Select Order" DataIndex="CurrentOrder">
                        <Renderer Fn="orderRenderer" />
                        <Editor>
                            <ext:ComboBox
                                ID="OrderSelection"
                                runat="server"
                                DisplayField="ItemDescription"
                                ValueField="OrderId"
                                StoreID="Store2"
                                Mode="Local">
                            </ext:ComboBox>
                        </Editor>
                        <EditorOptions >
                            <Listeners>
                                <BeforeStartEdit Fn="onBeforeStartEdit" />
                            </Listeners>
                        </EditorOptions>
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <LoadMask ShowMask="true" />
        </ext:GridPanel> 
    </form>
</body>
</html>
  3. #3
    May 02, 2011, 7:21 PM
    Excellent! Thanks!

Similar Threads

  1. [CLOSED] Nested data in nested grids
    By FAS in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Apr 19, 2012, 7:51 PM
  2. loadrecord() on FormPanel doesn't bind fields in nested controls
    By SandorD in forum 1.x Help
    Replies: 0
    Last Post: Nov 20, 2009, 6:57 AM
  3. How to bind combo box editor in a grid to show/edit referenced objects
    By gido in forum 1.x Help
    Replies: 0
    Last Post: Jun 15, 2009, 8:47 AM
  4. how to bind store with HashTable Collection
    By akash in forum 1.x Help
    Replies: 3
    Last Post: May 21, 2009, 2:11 AM
  5. Nested UpdatePanel + Tabs + Editor
    By ljcorreia in forum Bugs
    Replies: 2
    Last Post: Aug 15, 2008, 2:41 PM

Tags for this Thread

Posting Permissions