Showing posts with label field. Show all posts
Showing posts with label field. Show all posts

Monday, March 26, 2012

How do I get the CalendarExtender to show Gridview Templete Field

Hi

i want to use Calendar Extender Control in My grid view's temple field how can i use that calendar control

Code (calendar extender is associated with End Date):

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="Employee Id,Start Date" DataSourceID="SqlDataSource1">
<Columns>
<asp:CommandField ShowEditButton="True" />
<asp:BoundField DataField="Employee Id" HeaderText="Employee Id" ReadOnly="True" SortExpression="Employee Id" />
<asp:TemplateField HeaderText="Start Date" SortExpression="Start Date">
<EditItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("[Start Date]") %>'></asp:Label>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("[Start Date]") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="End Date" SortExpression="End Date">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("[End Date]") %>'></asp:TextBox>
<cc1:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="Textbox1">
</cc1:CalendarExtender>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("[End Date]") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>

Saturday, March 24, 2012

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.