How can I utilize AjaxControlToolkit:CalendarExtender inside my Gridview during edit mode?

Hello guys,

I have a Gridview control that has StartDate, EndDate field columns. In edit mode, when I clicked the StartDate or EndDate textbox to change the date, I need the calendarExtender popup, so I can select any particular date.

I tried this code in my ASPX page code behind, but still didn't work. Here is the code snippet:

...
TextBox txtStartDate = (TextBox)row.FindControl("txtStartDate");
AjaxControlToolkit.CalendarExtender calExtender =new AjaxControlToolkit.CalendarExtender();
calExtender.Format ="MM/d/yyyy";
calExtender.CssClass ="ajax__calendar";
calExtender.TargetControlID ="txtStartDate";
calExtender.DataBind();

TextBox txtEndDate = (TextBox)row.FindControl("txtEndDate");
AjaxControlToolkit.CalendarExtender calExtender2 =new AjaxControlToolkit.CalendarExtender();
calExtender2.Format ="MM/d/yyyy";
calExtender2.CssClass ="ajax__calendar";
calExtender2.TargetControlID ="txtEndDate";
calExtender2.DataBind();
...

Is there any step procedures, source code, or reference example, etc. I can use to accomplish this task? I greatly appreciate for any help to solve this problem. Thanks.

Why not convert your bound column to a item template column and drop the CalendarExtender Control directly inside the GridView?

or just use something similar toGreg Benoit's resusable calendar solution

I use this all over my site and i only have 1 calendar extender in the entire app. You can easily attach the extender on-the-fly using his example

I'll try to implement it on my Gridview control. Thanks for your suggestion.