DataBinding GridPanel/Store/Reader

[nuno_Santos]

Hi everyone,


I'm using a gridpanel in association with a store which contains a jsonreader.

This is what i have:
aspx

    <ext:Store ID="Store1" runat="server" OnRefreshData="Store1_RefreshData" RefreshAfterSaving="Always" OnDataBinding="Store1_DataBinding">
        <Reader>
            <ext:JsonReader ReaderID="Id" OnDataBinding="Reader_DataBinding">
                <Fields>
                    <ext:RecordField Name="ClockInOutDate" />
                    <ext:RecordField Name="WorkerId" />
                    <ext:RecordField Name="WorkId" />
                    <ext:RecordField Name="WorkExecuted" />
                    <ext:RecordField Name="ExtraDay" />                    
                    <ext:RecordField Name="ExtraDayValue" />
                    <ext:RecordField Name="Absences" />
                    <ext:RecordField Name="AbsencesWholeDay" />
                    <ext:RecordField Name="HoursAbsences" />
                    <ext:RecordField Name="Lending" />
                    <ext:RecordField Name="LendingValue" />
                    <ext:RecordField Name="Displacement" />
                    <ext:RecordField Name="DisplacementValue" />
                    <ext:RecordField Name="WorkHours" />
                    <ext:RecordField Name="HourValue" />
                    <ext:RecordField Name="ExtraHour" />
                    <ext:RecordField Name="ExtraHourValue" />
                </Fields>
            </ext:JsonReader>            
        </Reader>
    </ext:Store>
     ....

    <ext:GridPanel ID="GridPanel1" 
                                runat="server" 
                                StoreID="Store1" 
                                StripeRows="true"
                                Header="false" 
                                Border="false"
                                TrackMouseOver="true" 
                                AutoExpandColumn="WorkExecuted" 
                                
                                >
                    <LoadMask ShowMask="true" Msg="a carregar..." />
                    <SelectionModel>
                       
<ext:RowSelectionModel ID="SelectedRowModel1" runat="server"
SingleSelect="true" >                        
                            <AjaxEvents>                                
                                <RowSelect OnEvent="RowSelect_Event">
                                </RowSelect>
                            </AjaxEvents>
                        </ext:RowSelectionModel>
                    </SelectionModel>
                    <ColumnModel ID="ColumnModel1" runat="server">
                        <Columns>
                            <ext:Column 
                                ColumnID="ClockInOutDate" 
                                Header="Data" 
                                Width="60" 
                                Sortable="true" 
                                DataIndex="ClockInOutDate" />
                            <ext:Column 
                                ColumnID="WorkerId" 
                                Header="Cód. Colaborador" 
                                Width="60" 
                                Sortable="true" 
                                DataIndex="WorkerId">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="WorkId" 
                                Header="Nº Obra" 
                                Width="60" 
                                Sortable="true" 
                                DataIndex="WorkId">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="WorkExecuted" 
                                Header="Trabalho Executado" 
                                Width="120" 
                                Sortable="true"
                                DataIndex="WorkExecuted">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="ExtraDay" 
                                Header="Dia Extra" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="ExtraDay">
                                <Renderer Handler="return (value) ? 'Sim':'Não';" />          
                            </ext:Column>                            
                        </Columns>
                        <Columns>
                            <ext:Column 
                                ColumnID="ExtraDayValue" 
                                Header="Valor" 
                                Width="90" 
                                Sortable="true" 
                                DataIndex="ExtraDayValue" />
                            <ext:Column 
                                ColumnID="Absences" 
                                Header="Faltas" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="Absences">
                                <Renderer Handler="return (value) ? 'Sim':'Não';" />          
                            </ext:Column>
                            <ext:Column 
                                ColumnID="AbsencesWholeDay" 
                                Header="Integral/Horas" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="AbsencesWholeDay">
                                <Renderer Handler="return (value) ? 'Sim':'Não';" />          
                            </ext:Column>
                            <ext:Column 
                                ColumnID="HoursAbsences" 
                                Header="Horas" 
                                Width="40" 
                                Sortable="true"
                                DataIndex="HoursAbsences">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="Lending" 
                                Header="Empréstimos" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="Lending">
                                <Renderer Handler="return (value) ? 'Sim':'Não';" />          
                            </ext:Column>                            
                            <ext:Column 
                                ColumnID="LendingValue" 
                                Header="Valor" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="LendingValue">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="Displacement" 
                                Header="Deslocações" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="Displacement">
                                <Renderer Handler="return (value) ? 'Sim':'Não';" />          
                            </ext:Column>
                            <ext:Column 
                                ColumnID="DisplacementValue" 
                                Header="Valor" 
                                Width="40" 
                                Sortable="true"
                                DataIndex="DisplacementValue">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="WorkHours" 
                                Header="Horas de Trabalho" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="WorkHours">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="HourValue" 
                                Header="Valor Hora" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="HourValue">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="ExtraHour" 
                                Header="Hora Extra" 
                                Width="40" 
                                Sortable="true"
                                DataIndex="ExtraHour">
                            </ext:Column>
                            <ext:Column 
                                ColumnID="ExtraHourValue" 
                                Header="Valor Hora Extra" 
                                Width="40" 
                                Sortable="true" 
                                DataIndex="ExtraHourValue">
                            </ext:Column>                              
                        </Columns>
                    </ColumnModel>
                    <Plugins>
                        <ext:GridFilters runat="server" ID="GridFilters1" Local="true">
                            <Filters>                           
                                <ext:StringFilter DataIndex="ClockInOutDate" />
                                <ext:StringFilter DataIndex="WorkerId" />
                                <ext:StringFilter DataIndex="WorkId" />
                                <ext:StringFilter DataIndex="WorkExecuted" />
                                <ext:StringFilter DataIndex="ExtraDay" />
                                <ext:StringFilter DataIndex="ExtraDayValue" />
                                <ext:StringFilter DataIndex="Absences" />
                                <ext:StringFilter DataIndex="AbsencesWholeDay" />
                                <ext:StringFilter DataIndex="HoursAbsences" />
                                <ext:StringFilter DataIndex="Lending" />
                                <ext:StringFilter DataIndex="LendingValue" />
                                <ext:StringFilter DataIndex="Displacement" />
                                <ext:StringFilter DataIndex="DisplacementValue" />
                                <ext:StringFilter DataIndex="WorkHours" />
                                <ext:StringFilter DataIndex="HourValue" />
                                <ext:StringFilter DataIndex="ExtraHour" />
                                <ext:StringFilter DataIndex="ExtraHourValue" />
                            </Filters>
                        </ext:GridFilters>
                    </Plugins>
                    <BottomBar>
                       
<ext:PagingToolBar ID="PagingToolBar1" runat="server"
StoreID="Store1" PageSize="10" BeforePageText="Página"
AfterPageText="de {0}"
                            DisplayInfo="true" DisplayMsg="Exibindo Registos {0} - {1} de {2}" EmptyMsg="Vazio"/>
                    </BottomBar>
                    <Buttons>
                        <ext:Button ID="btnInsert" runat="server" Text="Novo">                           
                        </ext:Button>
                    </Buttons>
                </ext:GridPanel>

in my cs code, i do the following

            OClockInOutRegister bobj = new OClockInOutRegister();
            Store1.DataSource = bobj.ListAll();
            Store1.DataBind();

I'm trying do intercept dataBinding (server side) of the store, reader or grid because i need to test some values, and in certains circunstances, modify the value displayed on the grid.

The only place i could do that was on the store, but i can't understand how can i test field names and values, in order to see if i have to change the values of the column.
On the event, i could found that ((Store)sender).Reader.Reader.Fields give me all the fields on the reader and i can access the Name property, but i can't found where the value is.

Is this the best way? How can i do this? Is it possible to intercept dataBinding for the reader and gridPanel?


Thanks,
Nuno Santos

[Filip Beunens]

Hi, don't now what you exactly want to do but you could also use the renderer function of your grid like this example that builds a fullname from 2 value's but you can also return a image, another value, etc..... :

On your page this javascript :

<script type="text/javascript">
        var fullName = function(value, metadata, record, rowIndex, colIndex, store) {
            return '' + record.data.LastName + ' ' + record.data.FirstName + '';
        };
</script>

and where you build your columns

<ext:Column ColumnID="fullName" Header="Full Name" Width="150" DataIndex="LastName">
    <Renderer Fn="fullName" />
</ext:Column>

Filip

[nuno_Santos]

Hi Filip,


thanks for the reply, but i'm interested in intercept the event on the server.

Which i need to do involve some calculation with variables which i have on the server side....


Thanks,
Nuno Santos

[Filip Beunens]

Ok,

don't now what bobj.ListAll() delivers but you can return for example a list of product objects, do the calculation and bind to the store after you correct the data

For each bob in bobj.listAll()
Calculate....
Next

Filip

[nuno_Santos]

Hi Filip,



bobj.ListAll() delivers a List<OClockInOutRegister>.

Even if calculate the values i need in a foreach loop, the store is bound to the properties of OClockInOutRegister. I would need a new property to store the calulated values? This calculations are on the fly. It's just for grid view.

My goal, like i made with some other controls i used in the past, is to read the record data, make my calculations and then index the grid's column and set the value of it.


Thanks,
Nuno Santos