I have an issue with webdropdowns. I'm using WebDropDowns in a WebDatagrid via dropdownprovider. The dropdown contains a list of dates. The date format shown in the grid cell is correct, and the data format down in the list part of dropdown list is correct. But the value shown in the dropdown control itself is incorrect. The incorrect date format only shows up when I click on any cell the dropdown column. I uploaded an image of this issue, and hope it can explain better. The image is in this link: http://imgur.com/c5C4Y2E Please help me get the date format fixed.
More detail on my grid set up if it helps with the issue:
I'm using the dropdown in a BoundDataField inside a WebDataGrid. The BoundDataField has these properties set: Key="DropDown" DataFormatString="{0:ddd M/dd}" DataType="System.DateTime"
And the editor control inside the dropdownprovider has these properties set: EditorControl ID="DropDownControl" DisplayMode="DropDownList" ClientEvents-SelectionChanged="Some_Event"
The datasource for the Dropdown control is a dataset with 2 columns, one column has the type DateTime, and dropdown's ValueField is set to this column. The other column in the dataset is type string, it holds the date converted to {0:ddd M/dd} format, and the dropdown's TextField is set to this column.
Thanks,
Dan Ding
Hi, Dan.
I hope I will be able to help you with my answer.
Unfortunately the Text Field of the WebDropDown cannot be formatted and it always takes the item that is bound to, on the server-side. I can ensure that cause I've checked it in the drop down code and it always uses the text that is rendered from the server (You can open the Developer tools, search for the whole date (Thu Jan 14 2016...) and see how it is rendered in the client-side data source).
So one of the ways to do that is that your data source entity is formatted date. As far it is coming from a data base, you can use the ItemBound event, and inside to format the date that you want, for each individual date:
protected void WebDropDown1_ItemBound(object sender, Infragistics.Web.UI.ListControls.DropDownItemBoundEventArgs e) { ((Infragistics.Web.UI.ListControls.DropDownItem)e.Value).Text = ((Infragistics.Web.UI.ListControls.DropDownItem)e.Value).Text.Replace(" 12:00:00 AM", ""); }
The format depends on your needs. In your case you can take the Text value transform it to date and then take the day, month and day from the weak and concatenate them. Here is an article about that. Note that when the date is formatted on the server, then maybe you will not need additional formatting in the grid and in the list items.
Here a similar problem was discussed.
I will wait for your feedback.
Best Regards,
Nikolay Alipiev
Software Developer
Hi Nikolay, thank you for the response. I have tried out your suggestion, and it did not solve the problem I was having. I created a short project to demo the issue, but since I can't attach files, I'll paste the relevant code here:
Code for aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body> <form id="form1" runat="server"> <div> Grid <br /> <ig:WebScriptManager ID="WebScriptManager1" runat="server"> </ig:WebScriptManager> <ig:WebDataGrid ID="GridTest" runat="server" AutoGenerateColumns="false" EnableAjaxViewState="true" EnableDataViewState="true" EnableAjax="True" Width="20%"> <Columns> <ig:UnboundField Key="Date" DataType="System.DateTime" width="20%"></ig:UnboundField> </Columns> <Behaviors> <ig:Activation Enabled="true" /> <ig:EditingCore Enabled="true" BatchUpdating="true"> <Behaviors> <ig:CellEditing> <ColumnSettings> <ig:EditingColumnSetting ColumnKey="Date" EditorID="DateDropDownProvider" /> </ColumnSettings> </ig:CellEditing> <ig:RowAdding Enabled = "true"> </ig:RowAdding> </Behaviors> </ig:EditingCore> </Behaviors> <EditorProviders> <ig:DropDownProvider ID="DateDropDownProvider" EditorControl-Width="15%"> <EditorControl ID="DateDropDownControl" OnItemBound="DateDropDownControl_ItemBound" DisplayMode="DropDownList" runat="server"/> </ig:DropDownProvider> </EditorProviders> </ig:WebDataGrid>
<br /> <br /> DropDown <br /> <ig:WebDropDown runat="server" ID="DropDownTest" Width="20%"> </ig:WebDropDown> </div> </form></body></html>
Code for C#
using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using Infragistics.Web.UI.GridControls;using System.Data;using Infragistics.Web.UI.ListControls;
namespace WebApplication1{ public partial class WebForm1 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { //Create Data for DropDown DataSet test = new DataSet(); test.Tables.Add("test"); test.Tables[0].Columns.Add("Date", Type.GetType("System.DateTime")); test.Tables[0].Columns.Add("Text", Type.GetType("System.String"));
DataRow dr = test.Tables[0].NewRow(); dr["Date"] = DateTime.Now; dr["Text"] = DateTime.Now.ToString("ddd M/dd"); test.Tables[0].Rows.Add(dr);
DataRow dr2 = test.Tables[0].NewRow(); dr2["Date"] = DateTime.Today.AddDays(1); dr2["Text"] = DateTime.Today.AddDays(1).ToString("ddd M/dd"); test.Tables[0].Rows.Add(dr2);
//Bind Data to the DropDown Control DropDownTest.DataSource = test; DropDownTest.ValueField = "Date"; DropDownTest.TextField = "Text"; DropDownTest.DataBind();
//Bind Data to Editor Provider for the Grid WebDropDown gridDropDown = (WebDropDown)GridTest.EditorProviders["DateDropDownProvider"].GetEditor(); gridDropDown.DataSource = test; gridDropDown.ValueField = "Text"; gridDropDown.TextField = "Date"; gridDropDown.DataBind();
//Bind dummy dataset to the grid DataSet gridSource = new DataSet(); gridSource.Tables.Add("test"); gridSource.Tables[0].Columns.Add("Date", Type.GetType("System.DateTime")); DataRow dr3 = gridSource.Tables[0].NewRow(); dr3["Date"] = DateTime.Now; gridSource.Tables[0].Rows.Add(dr3);
GridTest.DataSource = gridSource; GridTest.DataBind(); }
protected void DateDropDownControl_ItemBound(object sender, Infragistics.Web.UI.ListControls.DropDownItemBoundEventArgs e) { ((DropDownItem)e.Value).Text = Convert.ToDateTime(((DropDownItem)e.Value).Value).ToString("ddd M/dd"); } }}
So on the page, I have 2 controls. the top one is a webdatagrid with 1 column to show the issue, and the bottom control is a webdropdown for sanity check. The dropdown list in the grid shows unformated date value of the selected value when the user enters cell edit, (otherwise the list itself shows correct date format, the cell shows correct date format after the user makes a selection).
So rephrasing the question a bit, is there anyway to make the dropdown provider show correct date format when user enter cell edit?
Here is the second sample.
Regards
As we have discussed it, I'm attaching two samples that resolve the problem you are having.
The first one is using the code you have shared. The notes for the first sample (WDD_SelectedValueMofidied) are:
Basically it is recommended for ValueField to use a unique value which can be easily bind to the value from the DropDownProvider item list by the WebDataGrid. As for the DataFormatString, on first initialization it will use the TextField value of the DropDownProvider which is correctly set to format "ddd M/dd". Now it won'jt be necessarily to set the text of the items on ItemBound server event.
As you will notice the only things that are have changed are:
- adding a new column which will be used for binding between the Grid and the ddprovider
- changing the Value field of the ddprovider
- and an ItemTemplate column is added, which can be also used with WebDropDown provider depending on client needs.
The second sample (DDPandDPPformatDates) shows another approach - format the Date object on selecting-data level.
Thank you for using our product!
Best regards,
Alright, thank you for taking the time to investigate this issue. Please keep me updated on when a fix will be available.
I've tried to add the the DataFormatString="{0:ddd M/dd}" to the Unbound column, but unfortunately it is not working. I've also tried to attach to the grid editing client-site event and inside to format the date, but again with no success.
So I've logged and internal issue in order, to investigate and fix it, or at least to find a proper way to resolve your case. Its development ID is 212479. The next step will be for a developer to review my investigation and confirm my findings or to offer a fix, or other resolution.
I will leave this case open and update you with any new information after the review. You can also continue to send updates to this case at any time. You can view the status of the development issue connected to this case by selecting the "Development Issues" tab when viewing this case on the web site.
I will update you when I locate the reason for that problem, in the context of the grid. Thank you for the patience!