I have two issues trying to make this control work for me at the moment. I am trying to let users select a date range, so I think what I want is two WebDateChoosers with the word "to" in between them.
1) When I slap two WebDateChoosers on my form and test clicking the down arrows, they aren't consistent with the z-index behavior. One of them correctly renders the calendar picker over the next div in the page (which contains a simple text heading), but the other renders the calendar *behind* the following div. I can't figure out why this might be happening, or which style to set to try to override the behavior.
2) What's the easiest way to get the two controls to render next to each other rather than one after another? I'm going to try putting them in a table. Actually, given the frequency of the "pick a date range" scenario, I'm thinking of writing a composite control that just contains the two date choosers. Or is there a better way?
Thanks!
John
1. Your z index behavior may dependon what settings you have set on the WebDateChooser and your surrounding content. You may have to paste your aspx markup for me to take a look at.
2. The WebDateChooser will display as a block element. You can use a table or simply use css so that it displays inline.
<style type="text/css">
.inline { display: inline; }
</style>
<igsch:WebDateChooser ID="WebDateChooser1" runat="server" CssClass="inline">
</igsch:WebDateChooser>
http://www.w3schools.com/css/pr_class_display.asp
Thanks. I solved #2 a different way by creating a DateRangePicker class that inherits from CompositeControl and renders a little table with three columns: one WebDateChooser, "to" and a second WebDateChooser. Works great.
For #1, I haven't set any properties on the WebDateChooser, but I have used an AppStylist theme (Appletini) with my application. The following content doesn't have anything too odd about it, but here's a snippet of the .aspx (this is just a test page):
<div id="reportCriteria"> <igsch:WebDateChooser ID="WebDateChooser1" runat="server"> </igsch:WebDateChooser> <igsch:WebDateChooser ID="WebDateChooser2" runat="server"> </igsch:WebDateChooser></div><div id="main"> <h2>Data For Annual Sales Chart</h2> <p><img src="images/test/grid.png" /></p></div>
The first control's calendar displays behind the text "Data For Annual Sales Chart" but the second control correctly drops down in front of the header text.
I can't figure it out for the life of me ...