Hi, I don't see a current post, so here it is. I have a WebDateTimeEditor below. I have the properties set, I've even tried setting them in code-behind, but nothing seems to change the format. When I attach the columnkey property to my grid field, the data is presented as Mon May 23 00:00:00 CDT, instead of 5/23/2011. I tried a format string of mm/dd/yyyy, but the online help only showed g for short date string. Also, when I click it to edit ti shows the date/time format of __/__/____ __:__. This of course is not correct either. If I should just be using a different format string, other than mm/dd/yyyy, what is it since help only shows "g" in the code-behind sample? Thanks.
<ig:WebDateTimeEditor ID="dtPerformancePlanCompletedDate" runat="server" BackColor="yellow" DataMode="DateOrDBNull" DisplayModeFormat="g" EditModeFormat="g" Nullable="true" NullText="Select a Date" columnkey="COMPLETEDDATE"></ig:WebDateTimeEditor>
Hello Dbishop9,
The format of the datetime column in your grid needs to be the same like in the WebDataTime editor. If you apply a short date time for the grids column the results should appear as expected.
Try this approach and let me know if it works for you.
Also you can attach your sample here and I could investigate and modify it.
Looking forward to hear from you
Sincerely,
Georgi Sashev
Developer Support Engineer
Infragistics, Inc.
http://ko.infragistics.com/support
Thanks, Georgi. Below is the format I have for the grid column in the InitializeLayout method. But I'm not familiar with the date formatting for the WebDateTime editor of "g" (see previous post). Is this the correct format code to use in the WebDateTime editor or should I be using something else? And the code below correct for the grid column?
.DataType = "System.DateTime".Format = "MM/dd/yyyy"
Hi Georgi. Thanks for the info. I've changed the formats to "d", but they still don't display correctly. The Editing Format works, but the Display Format is lost somewhere. Also, the samples pages don't provide any real information for this. I'm not sure how I am going to fix this. I have to use some type of date editor and this seems to be the only one that will actually work, except for this simple formatting issue. Is there a way to set this client-side? Like when the control initializes? I've tried setting it when the row initializes, but that doesn't work either.
Can you provide me with a sample code? This way I will be able to investigate this issue further and to advise you how to solve ti.
Hi Georgi, below is what I have. this is in a content page of a masterpage, vs2008 sp1, Infragistics 3.5 v10.1.20103.2134.
var dateChooserMyGridDueDate = null;function igMyGrid_BeforeRowTemplateOpenHandler(gridName, rowId, templateId) { var row = igtbl_getRowById(rowId); var currentValueDueDate = row.getCell(5).getValue(); dateChooserMyGridDueDate.value = currentValueDueDate; dateChooserMyGridDueDate.inputBox.value = currentValueDueDate; }function igMyGridDueDate_InitializeDateChooser(oDateChooser) { dateChooserInitiativeDueDate = oDateChooser;}
<igtbl:UltraWebGrid ID="igMyGrid" runat="server" EnableAppStyling="True" StyleSetName="Office2007Blue" StyleSetPath="~/ig_res/" DisplayLayout-CellPaddingDefault="5"> <Bands> <igtbl:UltraGridBand> <Columns> <igtbl:UltraGridColumn BaseColumnName="ID" Key="ID" Hidden="true"> </igtbl:UltraGridColumn> <igtbl:UltraGridColumn BaseColumnName="Number" Key="Number"> <Header Caption="Number"> <RowLayoutColumnInfo OriginX="2" /> </Header> <HeaderStyle HorizontalAlign="Left" /> <CellStyle HorizontalAlign="Left" /> <Footer> <RowLayoutColumnInfo OriginX="2" /> </Footer> </igtbl:UltraGridColumn> <igtbl:UltraGridColumn BaseColumnName="Description" Key="Description"> <Header Caption="Description"> <RowLayoutColumnInfo OriginX="3" /> </Header> <HeaderStyle HorizontalAlign="Left" /> <CellStyle HorizontalAlign="Left" /> <Footer> <RowLayoutColumnInfo OriginX="3" /> </Footer> </igtbl:UltraGridColumn> <igtbl:UltraGridColumn BaseColumnName="Lead" Key="Lead"> <Header Caption="Lead"> <RowLayoutColumnInfo OriginX="5" /> </Header> <HeaderStyle HorizontalAlign="Center" /> <CellStyle HorizontalAlign="Center" /> <Footer> <RowLayoutColumnInfo OriginX="5" /> </Footer> </igtbl:UltraGridColumn> <igtbl:UltraGridColumn BaseColumnName="DueDate" Key="DueDate"> <Header Caption="Due Date"> <RowLayoutColumnInfo OriginX="6" /> </Header> <HeaderStyle HorizontalAlign="Center" /> <CellStyle HorizontalAlign="Center" /> <Footer> <RowLayoutColumnInfo OriginX="6" /> </Footer> </igtbl:UltraGridColumn> </Columns> <RowEditTemplate> <div id="divMyGridControls" style="background-color: #E5ECFD;"> <p align="left" style="padding: 2px 2px 2px 2px; border-color: Lightgray; border-width: 1px; border-style: solid;"> <asp:Table ID="tblMyGridControls" runat="server"> <asp:TableRow Visible="false"> <asp:TableCell ColumnSpan="2"> <asp:Label ID="lblMyGridID" runat="server" columnkey="ID"></asp:Label> </asp:TableCell> </asp:TableRow> <asp:TableRow> <asp:TableCell Width="110px"> <asp:Label ID="lblMyGridNumber" runat="server">Number</asp:Label> </asp:TableCell> <asp:TableCell> <asp:TextBox ID="txtMyGridNumber" runat="server" MaxLength="25" ToolTip="Number" Width="150px" columnkey="Number"></asp:TextBox> </asp:TableCell> </asp:TableRow> <asp:TableRow> <asp:TableCell> <asp:Label ID="lblDescription" runat="server">Name</asp:Label> </asp:TableCell> <asp:TableCell> <asp:TextBox ID="txtDescription" runat="server" TextMode="MultiLine" Rows="3" MaxLength="10000" ToolTip="10,000 Maximum Characters" Width="850px" columnkey="Description"></asp:TextBox> </asp:TableCell> </asp:TableRow> <asp:TableRow> <asp:TableCell> <asp:Label ID="lblMyGridLead" runat="server">Lead</asp:Label> </asp:TableCell> <asp:TableCell> <asp:TextBox ID="txtMyGridLead" runat="server" ToolTip="Lead" Width="150px" columnkey="Lead"></asp:TextBox> </asp:TableCell> </asp:TableRow> <asp:TableRow> <asp:TableCell> <asp:Label ID="lblMyGridDueDate" runat="server">Due Date</asp:Label> </asp:TableCell> <asp:TableCell> <igsch:WebDateChooser ID="igMyGridDueDate" runat="server" EnableAppStyling="True" Section508Compliant="true" DisplayModeFormat="d" EditModeFormat="d" AllowNull="true" StyleSetName="Office2007Blue" StyleSetPath="~/ig_res/" NullDateLabel="Select a Date" ClientSideEvents-InitializeDateChooser="igMyGridDueDate_InitializeDateChooser" Format="Short"> </igsch:WebDateChooser> </asp:TableCell> </asp:TableRow> </asp:Table> </p> <p align="center" style="background-color: #D5DDEA; vertical-align: middle; padding: 2px 2px 0px 2px; border-color: Gray; border-width: 1px; border-style: solid;"> <asp:ImageButton ID="ibtnMyGridOK" runat="server" ImageUrl="~/Images/oknew.png" OnClick="ibtnMyGridOK_Click" /> <asp:ImageButton ID="ibtnMyGridCancel" runat="server" ImageUrl="~/Images/cancelnew.png" /> </p> </div> </RowEditTemplate> <RowTemplateStyle Wrap="true"> </RowTemplateStyle> <AddNewRow View="Bottom" Visible="Yes"> </AddNewRow> </igtbl:UltraGridBand> </Bands> <DisplayLayout Name="igMyGrid" AllowDeleteDefault="Yes" AllowSortingDefault="No" AllowUpdateDefault="RowTemplateOnly" BorderCollapseDefault="Separate" CellPaddingDefault="5" AutoGenerateColumns="false" RowSelectorsDefault="Yes" RowHeightDefault="20px" NoDataMessage="No Records To Display" Version="4.00" CellClickActionDefault="Edit" SelectTypeRowDefault="Single" AllowAddNewDefault="Yes"> <ClientSideEvents BeforeRowTemplateOpenHandler="igMyGrid_BeforeRowTemplateOpenHandler" /> <FrameStyle> </FrameStyle> <ActivationObject BorderColor="" BorderWidth=""> </ActivationObject> </DisplayLayout> </igtbl:UltraWebGrid>
Protected Sub igMyGrid_InitializeLayout(ByVal sender As Object, ByVal e As Infragistics.WebUI.UltraWebGrid.LayoutEventArgs) Handles igMyGrid.InitializeLayout With e.Layout.Bands(0).Columns.FromKey("Number") .Header.Caption = "Number" .Header.Style.HorizontalAlign = HorizontalAlign.Center .CellStyle.HorizontalAlign = HorizontalAlign.Center .CellStyle.Wrap = True .Width = Unit.Pixel(75) End With With e.Layout.Bands(0).Columns.FromKey("Description") .Header.Caption = "Initiative" .Header.Style.HorizontalAlign = HorizontalAlign.Left .CellStyle.HorizontalAlign = HorizontalAlign.Left .CellStyle.Wrap = True .Width = Unit.Pixel(450) End With With e.Layout.Bands(0).Columns.FromKey("Lead") .Header.Caption = "Lead" .Header.Style.HorizontalAlign = HorizontalAlign.Center .CellStyle.HorizontalAlign = HorizontalAlign.Center .CellStyle.Wrap = True .Width = Unit.Pixel(100) End With With e.Layout.Bands(0).Columns.FromKey("DueDate") .Header.Caption = "DueDate" .DataType = "System.DateTime" .Format = "MM/dd/yyyy" .Header.Style.HorizontalAlign = HorizontalAlign.Center .CellStyle.HorizontalAlign = HorizontalAlign.Center .Width = Unit.Pixel(100) End With
End Sub
Protected Sub igMyGrid_InitializeRow(ByVal sender As Object, ByVal e As Infragistics.WebUI.UltraWebGrid.RowEventArgs) Handles igMyGrid.InitializeRow Dim lMyGridID As Label = igMyGrid.Bands(0).RowEditItem.FindControl("lblMyGridID") If Not IsNothing(lInitiativeID) Then lInitiativeID.Text = e.Row.Cells(0).Text End If
Protected Sub ibtnMyGridOK_Click() 'this calls a method to save the record CheckEditItems() End Sub
Here is a followup. I have resolved the issue on my own. While this may not be the "best" way to do it, it is the only one so far that works for me. What I did was, in the BeforeRowTemplateOpenHandler, just before I assign the cell's date value to the WebDateChooser, I manually format the UTC date by using a bit of free javascript from the following link rather than spending time building my own formatting function.(I don't know if it's okay to include an outside link or not).
http://blog.stevenlevithan.com/archives/date-time-format
So my code is now as follows:
function igMyGrid_BeforeRowTemplateOpenHandler(gridName, rowId, templateId) { var row = igtbl_getRowById(rowId); var currentValDueDate = row.getCell(1).getValue(); var currentValueCompletedDate = row.getCell(6).getValue(); currentValDueDate = dateFormat(currentValDueDate, "mm/dd/yyyy"); currentValueCompletedDate = dateFormat(currentValueCompletedDate, "mm/dd/yyyy"); dateChooserDueDate.value = currentValDueDate; dateChooserDueDate.inputBox.value = currentValDueDate; dateChooserCompletedDate.value = currentValueCompletedDate; dateChooserCompletedDate.inputBox.value = currentValueCompletedDate;}
function igMyGridDueDate_InitializeDateChooser(oDateChooser) { dateChooserDueDate = oDateChooser;}function igMyGridCompletedDate_InitializeDateChooser(oDateChooser) { dateChooserCompletedDate = oDateChooser;
}
This now makes the WebDateChooser display the initial date value as 02/01/2012, as it is supposed to. Again, I'm still not sure what I have set/notset that was causing the previous methods to fail, but this overrides that and gives me the expected result I need.
I am glad that you have solved this.
If you have any further question, please do not hesitate to contact me.