Calendar Display during Scrolling

4 posts, 0 answers
  1. Andy
    Andy avatar
    31 posts
    Member since:
    Nov 2010

    Posted 11 May 2018 Link to this post

    Our users have notices that when the page is scrolled with the date picker control open and calendar is showing, that the calendar does not move with the date textbox as the page is scrolled.  Is there any way to have the dropdown calendar also move when page is scrolled.
  2. Vessy
    Admin
    Vessy avatar
    1992 posts

    Posted 16 May 2018 Link to this post

    Hi Andy,

    We are aware of similar behavior related to the positioning of the RadDаtePicker parent elements. Can you ,please, try setting "position:relative" style to the RadDatePicker element or/ands its wrapper and see if he problem persists?
    .wrappingElementClass {
        position: relative;
    }


    If this does not help to resolve the issue, please, send us a sample page where we can reproduce the issue and examine the exact configuration that is leading to it.


    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Andy
    Andy avatar
    31 posts
    Member since:
    Nov 2010

    Posted 17 May 2018 in reply to Vessy Link to this post

    Could you provide more detailed instructions.  I do not know where to add this style.  We are using one of the provided skins and I don't see this element in any of the css files.

    Thanks.

  4. Vessy
    Admin
    Vessy avatar
    1992 posts

    Posted 18 May 2018 Link to this post

    Hi Andy,

    Please, excuse me for not being clear enough in my previous reply. This is not an actual class name, you should replace it with the existing class of a DatePicker's wrapper from your actual page. If you want you can send me a runnable page reproducing the problem, so I can examine the exact layout that you use and advise you on the element you have to style.

    On a side note For example, if you have a div wrapping the DatePicker you can try styling it like suggested:
    <div class="replaceThisClassWithActualOne">
        <telerik:RadDatePicker ID="RadDatePicker1" runat="server"></telerik:RadDatePicker>
    </div>
    <style>
        .replaceThisClassWithActualOne {
            position: relative;
        }
    </style>



    If this does not help, though, please, send us your setup, so we can examine the layout leading to the problem further and advise you on how to fix it.


    Regards,
    Vessy
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top