search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

How to manually resize the scheduler (and calendar) vertically on initial page load

Asked by Rick
8 years ago.

Hi, good afternoon,

I have my heightSpec property set to "Fixed" and am updating the height property of the calendar upon resizing of the browser window, which works great; looks like I'm doing that just before the scheduler processes the window size changed event, which is pure luck of course....

I'm having less luck with the initial page load, though. I can't seem to figure out how to have the control redraw itself after the page initially loads and I've set the height property to the correct value. I've tried on page load and on AfterRenderComplete and am setting the height property to the value I need it to be in those handlers. Scheduler.update() doesn't seem to do anything after setting that height property; I'm only getting the correct size of the control when I resize the window after the page has been loaded (even if I remove my resize handler that resets the height property again, meaning that the initial height property WAS set correctly... I just can't seem to get it to redraw itself after that).

Thanks,
Rick

Answer posted by Dan Letecky [DayPilot]
8 years ago.

There are two options:

  • Use HeightSpec="Parent100Pct" and let the scheduler adjust its height according to the parent element automatically (see http://doc.daypilot.org/scheduler/100-pct-height/). It uses a window.onresize handler internally (basically the same what you are doing).
Comment posted by Rick
8 years ago.

Hi Dan,

Sorry for the late reply (really missing email notifications on this forum... is there any way to get notified on new postings to some thread?)

My version (still the evaluation version) doesn't seem to have the setHeight method on its java script object.

Thanks,
Rick

Comment posted by Alex
8 years ago.

I am having the same problem in my calendar, I'm doing dp.heightSpec = "Parent100Pct" when initializing the calendar, the div class="calendar_main" is set to 100% which is fine, but the div data-id="nav.scroll" has height 300px, this last div is updating the height only if I resize the browser and not in the initial load.

Can anyone suggest a solution

Comment posted by Dan Letecky [DayPilot]
8 years ago.

You can force the height update using a manual .show() call.

See also:
http://api.daypilot.org/daypilot-calendar-show/

Sometimes the calendar is not able to detect its dimensions properly (e.g. when it is inside a hidden div during initialization).

Comment posted by Dan Letecky [DayPilot]
8 years ago.

Update - calling .show() updates the height properly since the following builds:

DayPilot Pro for JavaScript 7.7.795
DayPilot Pro for ASP.NET WebForms 7.7.3087

Comment posted by Alex
8 years ago.

Hi Dan,

Thanks so much, .show() now working perfectly.

This question is more than 3 months old and has been closed. Please create a new question if you have anything to add.