Timeview scroll?

9 posts, 0 answers
  1. AK
    AK avatar
    30 posts
    Member since:
    Jun 2012

    Posted 07 Jul 2008 Link to this post

    I have a timeview that needs to show times for about 12 hours in 5 minute intervals. When using the Web20 skin, the timeview appears too large and may not display properly depending on the user's screen resolution.

    Is there a way to get the timeview popup to scroll and maintain a constant height/width. Using the height/width properties doesn't appear to make a difference.

    Thanks.
  2. Dimo
    Admin
    Dimo avatar
    8478 posts

    Posted 08 Jul 2008 Link to this post

    Hello AK,

    Here is how to do it:


    <head runat="server"
     
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
       <style type="text/css"
       #<%= RadTimePicker1.ClientID %>_timeView_wrapper 
       { 
           overflow:auto; 
           width:100px; 
           height:100px; 
       } 
       </style> 
    </telerik:RadCodeBlock> 
     
    </head> 
     
    <body> 
    <form id="form1" runat="server"
    <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
     
        <telerik:RadTimePicker ID="RadTimePicker1" runat="server" /> 
     
    </form> 
    </body> 


    Let us know if you need further advice.


    Regards,
    Dimo
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. AK
    AK avatar
    30 posts
    Member since:
    Jun 2012

    Posted 08 Jul 2008 Link to this post

    Worked like a charm. Perfect!

    Thanks!
  4. AK
    AK avatar
    30 posts
    Member since:
    Jun 2012

    Posted 08 Jul 2008 Link to this post

    One more request.

    How can I accomplish the same thing if the timepicker is in an edit form of a RadGrid?

    Thanks.
  5. Daniel
    Admin
    Daniel avatar
    4949 posts

    Posted 11 Jul 2008 Link to this post

    Hello Andrew,

    I suggest you to use similar approach as shown below:
    function radTimePicker1_load(sender, eventArgs) 
        var wrapperID = sender._clientID.replace(/_dateInput/, "_timeView_wrapper"); 
        var elem = document.getElementById(wrapperID); 
         
        elem.style.overflow = "auto"
        elem.style.width = "100px"
        elem.style.height = "100px";        

    Regards,
    Daniel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. AK
    AK avatar
    30 posts
    Member since:
    Jun 2012

    Posted 11 Jul 2008 Link to this post

    Thanks for the suggestion. I can't seem to get this line to pick up the client ID:

    var wrapperID = sender._clientID.replace(/_dateInput/, "_timeView_wrapper");

    Is their an event to wire the script to or something else I need to modify to match the ids of my grid or timepicker?

    Thanks.

  7. Daniel
    Admin
    Daniel avatar
    4949 posts

    Posted 14 Jul 2008 Link to this post

    Hello Andrew,

    Basically this is the only possible way (excluding the use of attributes, which is non-XHTML compliant) to get the timeView wrapper. It cannot be accessed directly, nor you can modify its style at the beginning because the element is created after the control creation.

    Kind Regards,
    Daniel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  8. Tony
    Tony avatar
    9 posts
    Member since:
    Apr 2005

    Posted 26 Sep 2008 Link to this post

    Does this also work with RadDateTimePicker ?
  9. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 29 Sep 2008 Link to this post

    Hi Developer,

    The same logic should be applicable for the RadDateTimePicker control as well. Another technique to access server controls in grid template on the client is demonstrated in the sample project from this code library thread.

    Best regards,
    Stephen
    the Telerik team

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