objects with reference type properties in GridPanel

[zikr]

Hi, I'm trying to get working GridPanel with objects that contains class type properties.Here is code snipsets:

my simplyfied dto's are here:

[CODE]
abstract public class BaseDto : IDto
{
private int id;
private int version;

public int Id
{
get { return id; }
set { id = value; }
}

public int Version
{
get { return version; }
set { version = value; }
}

public bool IsTransient
{
get
{
return id == default(int);
}
}
}
[CODE]

my working time dto, that contains reference to resource dto:
[CODE]
public class WorkingTimeDto : BaseDto
{
private string description;
private WorkingTimeStatus status;
private ResourceDto resource;


public string Description
{
get { return description; }
set { description = value; }
}

public WorkingTimeStatus Status
{
get { return status; }
set { status = value; }
}

public ResourceDto Resource
{
get { return resource; }
set { resource = value; }
}
}
[CODE]

and resource dto:
[CODE]
public class ResourceDto : BaseDto
{
private double hourlyRate;


public double HourlyRate
{
get { return hourlyRate; }
set { hourlyRate = value; }
}
}
[CODE]

I have configured main store for GridPanel that shows working time dtos. Store code:

[CODE]
<ext:Store ID="WorkingTimeStore" runat="server" OnRefreshData="GetWorkingTimes" OnBeforeRecordUpdated="BeforeWorkingTimeUpdate"
OnBeforeRecordInserted="BeforeWorkingTimeInsert" OnBeforeRecordDeleted="BeforeWorkingTimeDelete"
RemoteSort="true">
<Proxy>
<ext:DataSourceProxy />
</Proxy>
<Reader>
<ext:JsonReader ReaderID="Id">
<Fields>
<ext:RecordField Name="Id">
</ext:RecordField>
<ext:RecordField Name="Version">
</ext:RecordField>
<ext:RecordField Name="Resource">
</ext:RecordField>
<ext:RecordField Name="Payable">
</ext:RecordField>
<ext:RecordField Name="Status">
</ext:RecordField>
<ext:RecordField Name="Description">
</ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
<AutoLoadParams>
<ext:Parameter Name="start" Value="0" Mode="Raw" />
<ext:Parameter Name="limit" Value="10" Mode="Raw" />
</AutoLoadParams>
<SortInfo Field="Id" Direction="ASC" />
<Listeners>
<LoadException Handler="Ext.Msg.alert('Working Times - Load failed', e.message || e )" />
</Listeners>
</ext:Store>
[CODE]

and here is grid panel:

[CODE]
<ext:GridPanel ID="GridPanel1" Title="Time" runat="server" StoreID="WorkingTimeStore"
AutoExpandColumn="Description" AutoHeight="true" Width="800" ButtonAlign="Center">
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:Column DataIndex="Resource" Header="Resources" Width="200">
<Renderer Fn="resourceName" />
<Editor>
<ext:ComboBox runat="server" StoreID="ResourcesStore" Editable="false" DisplayField="FullName"
ValueField="Id" TriggerAction="All" Mode="Local">
</ext:ComboBox>
</Editor>
</ext:Column>
<ext:Column ColumnID="Description" DataIndex="Description" Header="Notes">
<Editor>
<ext:TextField ID="TextField6" runat="server">
</ext:TextField>
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
[CODE]

Combobox is configured to use another ResourcesStore, that contains dto's another that ResourceDto - only with 2 properties - Id and full name.Everything is working for me except when I first time load grid resource columns are empty. As understood this is because I need to provide integer Id in some way for combobox column or I'm something misunderstanding? If I'm right, then how I could do that? Have seen that RecordField contains property Converter. I have tried it with JavaScript function with one argument value, but this value always are string with one space.

Thanks,
Z.

[zikr]

Hi,
any ideas Coolite experienced users?

Thanks,
Z.

[Vladimir]

*Hi,

Please investigate this topic
http://forums.ext.net/showthread.php...2888-16-1.aspx



It can help to solve your problem

[zikr]

Hi, Vladimir.

Thanks for help. It works. By the way when do you plan to fully support complex objects as properties in editable grids?

Thanks,
Z.

[Vladimir]

*May be you have code mockup which shows how you want it be implemented?

[zikr]

Vladimir,
I guess that Coolite have near to all required functionality already from topic you pointed. Only editing party are not working fully. IMHO it would be enough if complex properties could be defined in store. For example here Resource property is complex object:

<ext:Store ID="WorkingTimeStore" runat="server" OnRefreshData="GetWorkingTimes" OnBeforeRecordUpdated="BeforeWorkingTimeUpdate"
        OnBeforeRecordInserted="BeforeWorkingTimeInsert" OnBeforeRecordDeleted="BeforeWorkingTimeDelete"
        RemoteSort="true" SerializationMode="Complex">
        <Proxy>
            <ext:DataSourceProxy />
        </Proxy>
        <Reader>
            <ext:JsonReader ReaderID="Id">
                <Fields>
                    <ext:RecordField Name="Id">
                    </ext:RecordField>
                    <ext:RecordField Name="Version">
                    </ext:RecordField>
                    <ext:RecordField Name="Resource">
                    </ext:RecordField>
                    <ext:RecordField Name="Payable">
                    </ext:RecordField>
                    <ext:RecordField Name="Hours">
                    </ext:RecordField>
                    <ext:RecordField Name="Description">
                    </ext:RecordField>
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>

Another store contains these referenced objects. Following example:

<ext:Store ID="ResourcesStore" runat="server" SerializationMode="Complex">
        <Reader>
            <ext:JsonReader ReaderID="Id">
                <Fields>
                    <ext:RecordField Name="Id" />
                    <ext:RecordField Name="FullName" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>

In grid panel in column's DataIndex contains just this property. Like:

<ext:GridPanel ID="GridPanel1" Title="Working times" runat="server" StoreID="WorkingTimeStore"
                        AutoExpandColumn="Description" AutoHeight="true" Width="800" ButtonAlign="Center">
                        <ColumnModel ID="ColumnModel2" runat="server">    
                            <Columns>
                                ...
                                <ext:Column DataIndex="Resource" Header="Resource" Width="200">
                                    <Renderer Fn="resourceName" />
                                    <Editor>
                                        <ext:ComboBox runat="server" StoreID="ResourcesStore" Editable="false" DisplayField="FullName"
                                            ValueField="Id" TriggerAction="All" Mode="Local">
                                        </ext:ComboBox>
                                    </Editor>
                                </ext:Column>
                                ...
                        </Columns>
     </ext:GridPanel>

And JavaScript render function finds this object and returns property:

<script type="text/javascript">
        function resourceName(value) {
            var obj = ResourcesStore.getById(value);
            if (Ext.isEmpty(obj)) {
                return "";
            }
            
            return obj.data.FullName;
        }
    </script>

Or maybe it could be even better to introduce new ComboBoxColumn where properties for Value and Display fields could be specified and secondary store for list of objects for this property. ComboboxColumn then would internally configure inline combobox editor. And could live without renderer function at all, because can generate required JS code from secondary store, value and display fields.
It is something similar to data binding used in grid control in Windows Forms. Seems that it would be nice if properties for inline combobox can be overrided - my be by explicity specifying tags

<Editor>
  <ext:ComboBox .../>
<Editor>

Also it would be nice if render function could be overriden by specifing Renderer like now.


These are my opinions,
Thanks,
Z.