Calendar control does not move with scrollbar

[Manoj]

Hi,

I am using a Calendar control on my page. when i scroll the page all controls move with scroll except Calendar control. Calendar control remains static and appears hanging in air.  However i want it to stick with date input and move with scollbar when i scroll the page.
I am sending some code to describe the problem.

<

form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<div style="height:300px; width:400px;overflow:scroll;">
<div style=" height:500px; width:350px">
<table ><tr><td>
<asp:TextBox ID="TextBox1" runat="server" Width="197px"></asp:TextBox>
</td></tr>
<tr><td>
<asp:Button ID="Button1" runat="server" Text="Button" />
</td></tr>
<tr><td>

<rad:RadDatePicker ID="datePikFmCrRangeStart" runat="server" EnableTyping="False" Skin="Default2006" Calendar-EnableMonthYearFastNavigation="false">
<DateInput ReadOnly="True" Skin="Outlook" CssClass="input" runat="server" ID="dateInput2">
</DateInput></rad:RadDatePicker>
</td>
</tr>
<tr>
<td>
<asp:HyperLink ID="HyperLink1" runat="server">HyperLink</asp:HyperLink>
</td>
</tr>
</table>
</div>
</div>
</form>

You can paste this code in a page and can see how the calendar control behaves.
I tried to set the Style="position:relative;" to this control but did not work.
please suggest me some solution.

Regards,
Manoj Dwivedi

[Daniel]

Hello Manoj,

Please the following this code:

<script type="text/javascript">

function HideOnScroll()

{

var datepicker = $find("<%= RadDatePicker1.ClientID %>");

if (datepicker.IsPopupVisible())

{

datepicker.TogglePopup();

}

}

</script>

<div style="height:300px; overflow:scroll;" onscroll="HideOnScroll()">
    <telerik:RadDatePicker ID="RadDatePicker1" runat="server" style="display: block; margin-top: 500px;">
    </telerik:RadDatePicker>
</div>

Regards,
Daniel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Manoj]

This workarround seems okey but is less suitable to my requirements. As i do not want to hide the calendar on scroll, so please suggest if there can be any other alternative.

Regards,
Manoj  Dwivedi

[Sebastian]

Hi Manoj,

Unfortunately there is no other alternative than to hide explicitly the dropdown holding the calendar instance when scrolling vertically. I hope that the solution proposed by my colleague Daniel is feasible workaround for you.

Best regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.