[CLOSED] Manually adding a new row to a grid - date issue

[mattwoberts]

Hi,

In my app I am adding a new row manually to a grid, like so:

updateGridWithNewChange: function (newRow) {

    var row = new ChangesStore.recordType(newRow, newChange.Id);
    ChangesStore.insert(0, row);

It works, but one of the properties of the "newRow" json object is a date/time field. The json object that gets passed to this function (newRow) has the datetime field formatted as per this example:

2011-10-24T20:40:23

When this column is added to the store used by my grid it gets the time one hour out - for the date above it displays as 21:40:23.. can anyone help?

My store and grid look like this:

<!-- Stores used -->
    <ext:Store ID="ChangesStore" runat="server" RemoteSort="true" WarningOnDirty="False"
        UseIdConfirmation="true">
        <Proxy>
            <ext:HttpProxy Url="/ChangesData/GetChangesSummary/" />
        </Proxy>
        <Reader>
            <ext:JsonReader IDProperty="CableSweepChangeId" Root="data" TotalProperty="total">
                <Fields>
                    <ext:RecordField Name="EquipmentId" />
                    <ext:RecordField Name="EquipmentPortNum" />
                    <ext:RecordField Name="CableSweepChangeId" />
                    <ext:RecordField Name="FrontEndId" />
                    <ext:RecordField Name="FrontEndPortNum" />
                    <ext:RecordField Name="IncomingTime" SortDir="DESC" Type="Date" />
                    <ext:RecordField Name="Description" />
                    <ext:RecordField Name="ChangePointFormatted" />
                    <ext:RecordField Name="DataLinkStateChange" />
                    <ext:RecordField Name="IsLink" />
                    <ext:RecordField Name="IsConnection" />
                    <ext:RecordField Name="IsLaptopChange" />
                    <ext:RecordField Name="OldLength" />
                    <ext:RecordField Name="NewLength" />
                    <ext:RecordField Name="CableLabel" />
                    <ext:RecordField Name="EquipCableLabel" />
                    <ext:RecordField Name="HorizCableLabel" />
                    <ext:RecordField Name="HorizCableId" />
                    <ext:RecordField Name="EquipCableId" />
                    <ext:RecordField Name="ChannelLabel" />
                    <ext:RecordField Name="EquipmentName" />
                </Fields>
            </ext:JsonReader>
        </Reader>
        <BaseParams>
            <ext:Parameter Name="limit" Value="15" Mode="Raw" />
            <ext:Parameter Name="start" Value="0" Mode="Raw" />
            <ext:Parameter Name="dir" Value="ASC" />
            <ext:Parameter Name="sort" Value="IncomingTime" />
            <ext:Parameter Name="cableIdFilter" Value="#{txtHiddenCableId}.getValue()" Mode="Raw" />
        </BaseParams>
        <SortInfo Field="IncomingTime" Direction="DESC" />
        <Listeners>
            <Load Fn="Changes.handleLoad" />
        </Listeners>
    </ext:Store>


<ext:GridPanel ID="ChangesGridPanel" runat="server" Header="false" Border="false"
                            StripeRows="True" AutoExpandColumn="Description" TrackMouseOver="true" Title="Changes"
                            RowHeight="0.43" StoreID="ChangesStore" ContextMenuID="ChangesGridContextMenu">
                            <ColumnModel ID="ColumnModel1" runat="server" DefaultSortable="false">
                                <Columns>
                                    <ext:DateColumn Width="120" ColumnID="IncomingTime" DataIndex="IncomingTime" Header="Date" Format="dd-MMM-yyyy G:i:s" />
                                    <ext:Column ColumnID="Description" DataIndex="Description" Header="Description/Comments">
                                        <Editor>
                                            <ext:TextField runat="server" />
                                        </Editor>
                                    </ext:Column>
                                    <ext:Column ColumnID="CableLabel" DataIndex="EquipCableLabel" Header="Equipment" />
                                    <ext:Column ColumnID="CableHoriz" DataIndex="HorizCableLabel" Header="Horizontal" />
                                    <ext:Column ColumnID="IsLaptop" DataIndex="IsLaptopChange" Header="Laptop?">
                                        <Renderer Fn="FormatIsLaptopChange" />
                                    </ext:Column>
                                    <ext:Column ColumnID="IsConnection" DataIndex="IsConnection" Header="Conn Status">
                                        <Renderer Fn="FormatIsConnection" />
                                    </ext:Column>
                                    <ext:Column ColumnID="Link" DataIndex="IsLink" Header="Network Link">
                                        <Renderer Fn="FormatLink" />
                                    </ext:Column>
                                    <ext:Column ColumnID="ChangePoint" DataIndex="ChangePointFormatted" Header="Change Point" />
                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:RowSelectionModel ID="RowSelectionModel1" runat="server">
                                    <Listeners>
                                        <RowSelect Fn="Changes.handleChangeRowClick" />
                                    </Listeners>
                                </ext:RowSelectionModel>
                            </SelectionModel>
                            <BottomBar>
                                <ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="15" Width="200">
                                    <Items>
                                        <ext:ToolbarSeparator ID="ToolbarSeparator1" runat="server" />
                                        <ext:Button runat="server" ID="gridFilterClear" Text="Clear Grid Filter" Icon="Zoom">
                                            <Listeners>
                                                <Click Handler="#{txtHiddenCableId}.setValue(''); Changes.reloadGrid();" />
                                            </Listeners>
                                        </ext:Button>
                                        <ext:Button Disabled="True" runat="server" ID="changeActions" Text="Selected Change Actions"
                                            Icon="Wrench" Menu="ChangesGridContextMenu">
                                        </ext:Button>
                                    </Items>
                                </ext:PagingToolbar>
                            </BottomBar>
                            <LoadMask ShowMask="false" />
                            <View>
                                <ext:GridView ID="GridView1" runat="server">
                                    <GetRowClass Fn="Changes.getChangesRowClass" />
                                </ext:GridView>
                            </View>
                            <Listeners>
                                <RowContextMenu Fn="Changes.setupContextMenu" />
                                <%--<AfterEdit Fn="Changes.handleChangeEdit" />--%>
                            </Listeners>
                            <DirectEvents>
                            <AfterEdit Url="/ChangesData/UpdateChange" CleanRequest="True">
                            <ExtraParams>
                                <ext:Parameter Name="id" Value="e.record.id" Mode="Raw"/>
                                <ext:Parameter Name="description" Value="e.value" Mode="Raw"/>
                                </ExtraParams>
                                </AfterEdit>
                            </DirectEvents>

                        </ext:GridPanel>

[Daniil]

Hi,

Please provide us with the locales of an application and PC.

As well, please provide a simple sample to run locally. I don't think a HttpProxy is required to reproduce the problem.

[mattwoberts]

Thanks

The server this runs on is set to default UK locale settings. Based on that date format provided in the sample above, I managed to work around the issue for now by adding this code:

    var row = new ChangesStore.recordType(newChange, newChange.CableSweepChangeId);

    // For reasons I couldn't work out, ExtJS formats the datetime one hour out. This parse forces it into the right format...
    row.data.IncomingTime = Date.parseDate(newChange.IncomingTime, "Y-m-dTh:i:s");

[Daniil]

Good point.

By the way, do you test under IE?

Is the issue reproducible on the other browsers?

Just I've already faced with a date parsing issue in IE and used the same workaround.