Wednesday 26 June 2013

Full Calendar Printing Issues

The Full Calendar has a thread with issues regarding printing the calendar.

https://code.google.com/p/fullcalendar/issues/detail?id=35

A Squashed Saturday Column

I was required to have a fluid layout where the width of the calendar region is 50% of the page, but there is a problem, the Saturday column appears squashed.

I have found 2 ways to fix this issue:

1. Give the width a static width rather than fluid, but in my case this doesn't meet the requirement.

2. Use a tiny bit of jQuery to set the width from fluid to static. You can run this on load, before printing, on page resize etc. For me I just needed to run this on page load.

Region Template
Give the Calendar a Region a Static ID so we can select the region supporting the calendar (not the calendar).

Page Onload
$(''#REGION').width($('#REGION').width());

It simply gets the pixel value of the region and sets it overwriting fluid.

And your print will now look like the following:



I have no doubt there a lots of way to achieve this but I found this the easiest.

All we need now is Full Calendar PDF Printing :)


3 comments:

  1. Your solution pointed me in the right direction, but didn't work as expected when the page was resized (or switched from portrait to landscape). Here's my update:

    $(window).resize(function () {
    $("#REGION").css("width", "100%");
    $("#REGION").width($("#REGION").width());
    });

    ReplyDelete
  2. Very efficiently written information. It will be priceless to anybody who uses it, together with myself. Sustain the good work – for positive i will try extra posts.

    ReplyDelete
  3. Been looking for this one. I asked several threads about this bug already, but there’s no concrete solution yet. I’m glad I found the solution to print my calendar schedule. Hope it will work on my printer tonight.


    calendar printing Los Angeles

    ReplyDelete