Change Height of Appointment "Node"

8 posts, 0 answers
  1. Brian
    Brian avatar
    68 posts
    Member since:
    Jun 2011

    Posted 01 Feb 2012 Link to this post

    If you go to the RadScheduler Web Service demo on the Telerik website, one of the things that you will be able to observe is the Height of each appointment "node" that appears within the scheduler. Obviously, the Height of each appointment represents the start time / end time of the specific appointment. For example, the Height of the Strategic Planning appointment for Monday the 30th visually depicts a start time / end time of 10am - 11am. Compare this, for example, to the Height of the all day appointments listed for Thursday the 2nd.

    In the upper-right of the scheduler are the different views (Day, Week, Month, Timeline). This demo defaults to Week view. If you click Timeline to change the view, notice that the start and end times are no longer included in this view, and all of the appointment "nodes" have the same Height.

    Is there a way to specify or change the Height of the appointment nodes that appear in Timeline view?

    Thank you,
    Steven

  2. Plamen
    Admin
    Plamen avatar
    2729 posts

    Posted 06 Feb 2012 Link to this post

    Hi Steven,

     
    In TimeLine-View you can set different width to the appointments depending on what is their duration as it is shown in the ExactTimeRendering demo. 

    If you want to increase the height of all appointments you can change the RowHeight property of RadScheduler.

    Hope this will be helpful.

    Kind regards,
    Plamen Zdravkov
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Brian
    Brian avatar
    68 posts
    Member since:
    Jun 2011

    Posted 06 Feb 2012 Link to this post

    Plamen
    That information helps.

    Can I submit a "feature request"? It would be nice if the Timeline view provided the ability to allow *individual* appointment nodes to grow and shrink, based on the amount of text stored with each node. Easier said than done, I'm sure, but it would be nice.

    Thanks for your reply,
    Steven
  5. Plamen
    Admin
    Plamen avatar
    2729 posts

    Posted 09 Feb 2012 Link to this post

    Hello Steven,

    Thank you for the suggestion. I'll forward it to our development team for further consideration.

    Regards,

    Plamen Zdravkov
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  6. Petulka77
    Petulka77 avatar
    1 posts
    Member since:
    Feb 2010

    Posted 28 Feb 2013 Link to this post

    Any update on that?

    Only solution what I have and which works for me is by CSS settings:

     .RadScheduler .rsTimelineView .rsWrap, .RadScheduler .rsTimelineView .rsApt, .RadScheduler .rsTimelineView .rsAptOut, .RadScheduler .rsTimelineView .rsAptIn, .RadScheduler .rsTimelineView .rsAptMid, .RadScheduler .rsTimelineView .rsAptContent
            {
                position: static !important;
                height: auto !important;
            }

    Declarative/programmatic adjustment would be helpful.
  7. Plamen
    Admin
    Plamen avatar
    2729 posts

    Posted 01 Mar 2013 Link to this post

    Hi,

     
    One possible programmatic workaround for setting the appointments autoheight in timeLineView is to use Appointment Template with a div as below and the following javascript:

    <AppointmentTemplate>
                <div class="newDiv">
    ...
     </div>
    <script type="text/javascript">
           function pageLoad() {
               var $ = $telerik.$;
               $(".rsWrap").each(function myfunction(index, elem) {
                   var $elem = $(elem),
                       newHeight = $elem.height();
                   $elem.find(".newDiv").each(function myfunction(ind, apt) {
                       var $apt = $(apt);
     
                       if ($apt.height() > newHeight) {
                           newHeight = $apt.height();
                       }
                       $apt.parents(".rsApt").height($apt.height());
                   })
                   $elem.height(newHeight);
               })
     
               //if you use group by resources in vertical direction
               var rsVerticalHeaderTableTh = $(".rsVerticalHeaderTable th");
               var rsAllDayTableTr = $(".rsAllDayTable tr");
               rsAllDayTableTr.each(function(index, elem) {
                   var h = $(elem).height() - 1;
                   rsVerticalHeaderTableTh[index].style.height = h + "px";
               });
           }
       </script>

    Hope this will be helpful.

    Regards,
    Plamen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  8. Mike
    Mike avatar
    14 posts
    Member since:
    Mar 2010

    Posted 06 Nov 2013 Link to this post

    I also recommend for this functionality to be included.
  9. Plamen
    Admin
    Plamen avatar
    2729 posts

    Posted 11 Nov 2013 Link to this post

    Hi Mike,

     
    Thank you for the suggestion -I will forward it to our developers team for consideration.

    Regards,
    Plamen
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017