Sunday, March 11, 2012

CalendarExtender loses style when placed inside a web user control.

Yes I think this is another flavor of a known issue that came up yesterday. Does it happen immediately or when you refresh the updatepanel?

I'm working with the contributor who authored Calendar to deliver a fix for this. We understand the problem but it's a tricky one to solve.

As a workaround, try this:

1) add another textbox to the page, outside the updatepanel

2) add a calendar extender and point at the textbox

3) on the textbox set 'style="display:none;" so it doesnt' show up on the page.

This should get the styles loaded early enough so this doesn't happen while we figure out a fix.


The textbox and extender aren't loaded initially. They load when the user clicks 'edit' and the panel refreshes.

Adding the display none textbox and extender did the trick.

Thanks,
Alex


Great - glad it worked for you.

Yeah, if they're not initally shown this is definitely the same issue. I've got someoene trying to work out a fix.


sburke_msft:

I've got someoene trying to work out a fix.

When do you think the fix will be available for us? The CalendarExtender control is a very helpful control if it really works specially if it is used inside an UpdatePanel... The problem is that other Calendar Popup controls available on the market (Ajax or non-Ajax) don't work either inside the UpdatePanel. Has anyone found one that works at this moment?

Thanks,

Andrei


I have one outside of an update panel -- in a detailview edititemtemplate, within an html table cell. When the popup appears, it spans the entire width of the page... any idea what could cause that behavior? It seems as though it isn't binding to the textbox location (though it does appear directly below the textbox -- it spans the width of the whole page).

I've tried various styles on the extender, but nothing seems to work there.

Thanks!

John


Sburke,

I have the same problem with the calendar extender within a web user control and the workaround works out but I need to create dozens of web user controls and I would like to know when this will work without workarounds. I'd rather wait a week or two for a fix than implement this workaround. The workaround is not neat, but it does work so I appreciate your effort greatly. Do you think you could give any kind of estimate when this will be looked into? Is it a matter of weeks? Months?

Thanks


Don't know how much this helps but I noticed that if you set EnablePartialRendering ="false" the script manager the original css is retained.


The issue with the calenderextender also exists with the HoverMenuExtender. I suspect it may affect all the AJAX popup controls? This issue is a show stopper for me as the CalenderExtender renders the calender missing the last two days (ie. Fridays and Saturdays) and the last 2 lines. I'm using the CalenderExtender in a web user control and within a gridview control. Even if the control is NOT in an update panel the CSS problem exists. I have confirmed that the style applied to the calenderextender is incorrect (ie the cells are given a padding or 4px...) I used the devtoolbar plugin on explorer to check this.

The workaround does not work for me! I've tried to insert the display:none textbox and calender outside the gridview control in the web user control and in the page that uses the web user control. Still no joy. If anyone can suggest another work around please post here.


ny_shock Could you post the workaround code that fixed the problem in your web controls?

I tried this...

<

asp:TextBoxrunat="server"ID="textbox2"/>

<cc1:CalendarExtenderID="ceTextBox1"runat="server"

TargetControlID="textbox1"/>

</div>

But it had no effect...


Sorry spot the deliverate mistake above... but anyway it still doesn't work.Crying
Hi there, on further investigation. The CalenderExtender not only seems to lose the CSS settings when using a web user control, but also if there are no web controls on the page and its used in a GridView control on in my cases an extended gridview control. The HoverMenuExtender has the same problem.Crying Crying Crying Crying Crying Crying

pback,

find your scriptmanager tag and set enablepartialrendering=false :

<asp:ScriptManager ID="ScriptManager1" EnablePageMethods="true" EnablePartialRendering =false runat="server" />

This when they will fix the calendar extender control you can remove this setting and your pages will be able to render partially, .. which in turn will make them refresh faster... but for now... we're stuck with this


ny_shock, yeah I tried that yesterday and it didn't work-so tried again this morning, still no joy for me!!. My original page consists of a form on a page that inherits a master page, the page then includes several web user controls, they in turn are using the calendarExtender to validate dates. I'm also using the HoverExtender to provide detail view popups (aka tooltips but with more information).

The picture link shows my test page, where I remove the web user controls and update panels to try to get the calendarexnder to work with my stylesheet...

Photobucket - Video and Image Hosting

Notice how the calendar in the gridview takes on the padding and color scheme from the grid. The colors are okay I suppose, but the formatting means the calendar is unusable since the user can't select friday or saturday. Any help would be greatly appreciated. Thanks again


I came across this article, and it didn't exactly solve my problem, but I thought I would post my solution since it could be helpful to this problem or one like mine.

I had a CalendarExtender in a cell of a table and it was picking up the padding and margin of the table cell that it was in. Hence you could not see Friday or Saturday on the calendar. Since I was using a style sheet on my table, I created the following style to get the padding and margin set for the calendar. Just replace ".EditTable" with the CSS Class name that you use. Also realize that this will affect any other tables that you might have inside of your table.

Hope this helps!

Robert L. Taylor

.EditTable td table tr td {padding:0;margin:0;}

No comments:

Post a Comment