how do I use a calendar popup in a repeater

I would really like to be able to use a calendar popup when editing items in a repeater. I would assume that handling this scenerio would be the same if you did it inside a gridview. Has anyone managed to get this to work and if so would you mind sharing some ideas? My biggest concern is that if you put the calendar control inside of the repeater you will end up with as many calendars as rows on the page which is a lot of extra html. It would be nice to be able to reuse a single calendar.

Thanks,
JustinI'd like to know how to do this as well.

It could be a popup calendar ... or it could be a hover panel that contains the calendar. What I'd like to have is a single extender instance that dynamically allows configuration of the contents of the extender (e.g. setting the date in the calendar for the particular gridrow/repeater data).

Yes - we hear you on the "dynamic configuration" point. I'm thinking through ways to have a unified method of doing that.

On this particular problem, I think what you want to do is to put an extender into the template and then have it point to a panel outside of the gridview. That way you share the popup, and the multiple extender instances don't really cost you very much.

<asp:Panel id="popup" runat="server><asp:Calendar id="cal" ...></Panel>

<asp:DataList>

<EditItemTemplate>

<asp:TextBox id="editTextBox"/>

<atlasToolkit:PopupControlExtender>

<atlasToolkit:PopupControlProperties TargetControlID='editTextBox' PopupControlID="popup"/>

</...>

Yes - we hear you on the "dynamic configuration" point. I'm thinking through ways to have a unified method of doing that.

On this particular problem, I think what you want to do is to put an extender into the template and then have it point to a panel outside of the gridview. That way you share the popup, and the multiple extender instances don't really cost you very much.

<asp:Panel id="popup" runat="server><asp:Calendar id="cal" ...></Panel>

<asp:DataList>

<EditItemTemplate>

<asp:TextBox id="editTextBox"/>

<atlasToolkit:PopupControlExtender>

<atlasToolkit:PopupControlProperties TargetControlID='editTextBox' PopupControlID="popup"/>

</...>

Hi,

Thanks for the information. The only problem that I am not ableto solve is that in the examples, the onselect event for the calendaris fed back to the server which then sets the value of the textbox. At least that is how I understood it worked. How doyou set the value of the current textbox in a grid or repeater using acalendar that is outside of the grid and that posts back to theserver? Is there a way to determine the selected textbox?

Thanks,
Justin

Justin,

Have you taken a look at the CommitScript property of the PopupControl? This allows you to run arbitrary script (including making function calls) when the PopupControl is closed. (Though it probably assumes that the PopupControl is using an UpdatePanel.)

Hi David,

I originally assumed that this is how it would be done, however what I am not clear on is how to do it. I have not been able to figure out how to get the id of the textbox and the value from the control within the context of the script that would be assigned to the CommitScript.

If you have any ideas or know of any helpful documentation it would be much appreciated.

Thanks,
Justin
I am having the same kind of problem with trying to get a popup calendar to show in an InsertTemplate for a FormView. Please see my source below.

<asp:Panel ID="Panel1" runat="server" CssClass="popupControl">
<atlas:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<center>
<asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="#999999" CellPadding="1" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Width="160px" OnSelectionChanged="Calendar1_SelectionChanged" Visible="False">
<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
<SelectorStyle BackColor="#CCCCCC" />
<WeekendDayStyle BackColor="#FFFFCC" />
<OtherMonthDayStyle ForeColor="Gray" />
<NextPrevStyle VerticalAlign="Bottom" />
<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
<TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />
</asp:Calendar>
</center
</ContentTemplate>
</atlas:UpdatePanel>
</asp:Panel
<asp:FormView ID="fvInfo" runat="server" DataKeyNames="id" DataSourceID="ds1"
DefaultMode="Insert">
<InsertItemTemplate>
Date of Birth:
<asp:TextBox ID="date_of_birthTextBox" runat="server" Text='<%# Bind("date_of_birth") %>'></asp:TextBox><br /
<asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" CommandName="Insert"
Text="Insert"></asp:LinkButton
<atlasToolkit:PopupControlExtender ID="PopupControlExtender1" runat="server">
<atlasToolkit:PopupControlProperties TargetControlID="date_of_birthTextBox" PopupControlID="Panel1" Position="Bottom" />
</atlasToolkit:PopupControlExtender>

</InsertItemTemplate>
</asp:FormView
/// <summary>
/// Handler for calendar changes
/// </summary>
/// <param name="sender">source</param>
/// <param name="e">arguments</param>
protected void Calendar1_SelectionChanged( object sender, EventArgs e )
{
// Popup result is the selected date
int iIndex = 0, iTxtIndex = -1;
AtlasControlToolkit.PopupControlExtender pExt = null;

foreach ( Control pCntrl in fvInfo.Controls )
{
if ( pCntrl.ID == "PopupControlExtender1" )
pExt = (AtlasControlToolkit.PopupControlExtender) pCntrl;

if ( pCntrl.ID == "date_of_birthTextBox" )
iTxtIndex = iIndex;

if ( (iTxtIndex >= 0) && (pExt != null) )
break;

iIndex++;
}
if((pExt != null) && (iTxtIndex >= 0))
pExt.Commit( fvInfo.Controls[iIndex], Calendar1.SelectedDate.ToShortDateString() );
}
This is where things are getting very tricky ... I may have worked my way into a solution.

BE AWARE OF THE FOLLOWING: The extenders are using the ClientID. If you have a simple form and no master ... ID == ClientID for top level controls.

If you are using FormView/GridView ... ClientID != ID.

If you are using Master ... ClientID != ID.

If you are using dynamic (non-markup driven template, i.e. custom ITemplate implementations) ... then you need to do the work yourself to ensure that you are providing the correct ClientID.

This is why I believe that I've seen a variety of problems raised ... folks are cut & pasting markup from a simple page into a much more complicated page and not accounting for this. And/Or the toolkit as of April CTP is not accounting for this.

While this isn't a solution ... it is what I've been learning the hard way ... hope it helps.

Yes - the extenders highlight ASP.NET naming semantics in very focused way. Most other ASP.NET things don't reference each other directly so you're able to avoid running into this.

The Toolkit can't do a ton to help you here. But one of the great things about being alpha-type code is that we can try things.

So in the refresh release (today or tomorrow probably), we've added an event to the extender that you can handle to help with this. Basically if we fail to find a control based on ID, we'll raise the event, hand you the ID, and give you a chance to find it. It might be a super helpful thing, it might just be a lot of rope, we'll see.

I have worked with various Microsoft development environments for anumber years now. This is quickly becoming the most fun becauseof the interaction with the guys who are building the code. Ihave to say thanks for the openness with these controls and the speedthat new items are released. I know that I am looking forward tothe next drop. I'll be playing with the events as soon as yourelease.

Thanks for the help and for listening.
Justin

Wow - thanks for saying that. That's really the goal, and just hearing that it's working makes it all worth it.

We're having a blast too, by the way. :)