11:00 PST 24 Aug 2009 - I've found a decent solution to the bug where calendars wouldn't expand by default unless you went forward or backward by a month. It's not the cleanest solution, but it will work and will be transparent to your users. I've updated the code below to the new code.
==================
16:00 PST 20 Aug 2009 - Update!!! - I'm able to duplicate the error whereby calendars will only expand after clicking the next/previous month buttons on my live site. Unfortunately there's something different about my dev site so that it works there, but on on the live. Stay tuned & I'll publish a fix.
==================
So how can you make the calendar display all the events in a day by default? Like every other SharePoint solution on this blog, a small bit of JavaScript and the trusty Content Editor Web Part (CEWP)!
- Add a CEWP below the calendar that you want to display in expanded view by default.
- Add this code to the CEWP "Source editor...":
<div id='cover' style='position:absolute;top:0px;left:0px;width:100%;background:white;'></div>
<script type="text/javascript">
var yScroll = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
var y = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight;
var xScroll = window.pageXOffset || document.body.scrollLeft || document.documentElement.scrollLeft;
var x = window.innerWidth || document.body.clientWidth || document.documentElement.clientWidth;
var cover = document.getElementById("cover");
cover.style.height = (y + yScroll) + "px";
cover.style.width = (x + xScroll) + "px";
function expand() {
if (document.referrer != location.href && !location.href.match(/CalendarPeriod=((week)|(day))/i)) { GetMonthView('11111111'); }
else { cover.style.display = "none"; }
}
window.onload = function() { expand(); };
</script>
friendfeed
linkedin
skype
identi.ca
twitter
utterli
plurk
brightkite
facebook
25 comments:
I was unable to get Expand Calendar Month View CEWP to work. Is there something that I might be missing?
Hi gmgbfisher,
I just re-tested this code and I think I may know what's happening. After you add the code to the page it won't expand the calendar immediately because of the way the code works.
Instead, after adding the code to a CEWP in the bottom of the page, exit "Edit Mode" and reload the page. You should see the calendar expanded now.
If this doesn't solve your problem, please feel free to send screenshots and I'll try & troubleshoot for you.
-Ben
that's pretty cool. it works for me.
Thanks!
Rachel
I tried implementing your code and it works for the most part. The one area where it does not work is when you initially go into the calendar. There it does not work. But when you start going forward or backward to another month, then it works great! it even works when you go back to the current month. Any help on why this does not work when you first go into the calendar?
Thanks!
Matt
Hi Matt,
The code I wrote relies on the built-in expand function provided by SharePoint. That function will reload the calendar.aspx page. When you click on the "Expand All" link at the top of the calendar, it takes you right back to the same page.
My code simply executes that command as long as the referring page ISN'T the page with the calendar. If it were then the code would stick you in an unending page reload loop.
When you go a month forward or backward, you're changing the address of the page so my code will see that the referral page isn't the page you're looking at and it will execute.
The only reason that this code wouldn't execute is if the referral page is the same as the calendar page.
I hope that I've made things a bit clearer, but if I haven't, please feel free to send me an email and we can work through it.
ben[at]bradleyit.com
-Ben
That's such an awesome solution, been looking for one that just does what it promises, for so long, had implemented you other solution just yesterday and now I've updated once more with this new one.
thanks for sharing your finding.
Jonathan
This works! but i was just wondering if you have a code to just display maybe 6 or 8 items, instead of the 4, the expanded view is not that pretty. Thanks for the help!
Hi JP,
Not yet, but you've given me an idea for something that might be pretty cool to build:
Instead of expanding the calendar and resizing the rows, what if when you "mouse-over"-ed one of the days it would open a tooltip showing all the events for that day?
What do you think?
-Ben
though that idea sounds cool, I'm not sure if it would be very useful, as most poeple want to see an occurrence for a for a length of time. a quick glance of monthly occurrences, you know what i mean?
For Example:
I am trying to get this to work for my agencies vocation calendar, they have it right now on a huge paper calendar at the front desk. Trying to move it to the SharePoint site. When its defaulted to expanded view, there is alot of extra space and formatting quirks. Wondering if anyone has a good solution to this...
This works very well with one exception...you have to be willing to sacrifice the day view. Currently the calendars I have this script running on can't display the day view, just gives you a blank page. The calendars without the script work normally.
Hi John,
I'm sorry to hear that the day view isn't working for you. Unfortunately, I'm unable to reproduce this problem so I can't offer a reliable solution.
However, my best bet is to make the following change to the "if" statement:
original:
if (document.referrer != location.href && !location.href.match(/CalendarPeriod=((week)|(day))/)) { GetMonthView('11111111'); }
modified:
if (document.referrer != location.href && !location.href.match(/CalendarPeriod=((week)|(day))/i)) { GetMonthView('11111111'); }
Give this a shot and pleas let me know if that works. If it doesn't and you're interested in fixing this, send me an email and I'd be happy to work through it with you: ben[at]bradleyit.com
-Ben
Ben - that did it!
What was happening is the Day button would work, but if you clicked on any day on the month view the page would be blank. Your modification worked!! Thanks, this was a really great solution for me.
Awesome! I'm glad it was an easy fix =)
FYI - the fix was to remove case matching in the document.referrer so that "Day" == "day"
Whoops...spoke too soon. It actually broke the script. So, it was "working" because the script wasn't running right to begin with. After adding that code in the calenders behave as if you never added the original code to begin with.
Hrrm, does IE show you an error icon in the lower left of the browser on the status bar? It would look like a little yellow triangle with an exclamation point if it did.
If you see that, double click it and view the details of the error, that will point me in the right direction to fix it. Also, if you see the error, try copy/pasting the code above into the CEWP again to verify there are no typos.
There's no browser error. It just says Done, but the page is blank. What's interesting, is that you see a blank page, but if you scroll down to see the remainder of the page, that part of the page is rendered. Strange.
Are you using IE8? If you are then you'll need to open the "Developer's Tools" (press F12), reload the page and click on the "Script" tab. This will tell specifically what's not working right.
The reason that you can scroll down and see the rest of the page is because I made a little DIV to cover the page while it loads the SharePoint function that expands the calendar. There's something amiss with the code that hides my DIV once the calendar has been expanded.
I'm using IE7. When I get on a machine that has IE8 on it I'll see if there is an error.
Worked great for me in IE6, WSS3, MOSS2007. Day view, week view still worked fine. Must navigate away and return to invoke. Love it!
IE7 - worked like a charm for all my calendars. Thank you so much for a terrific solution!
I love this solution, just what I was needing, but it makes the fly outs from below the global navigation disappear. Top level navigation is fine, the tabs show and work as normal, but the lower sub-site fly outs are gone. I should mention that I do use the PlanetWilson Coluor Coded Calendar. Anyone else seeing this? Any ideas to fix it? I tested, if I take the code off, navigatio definitely returns to normal. Love the solution, so if you can help I'd be most appreciative!
This worked great for me - thanks!
Thanks for your help.. This worked for me, and the one thing that stands out is: you said to add CEWP "below" calendar... I was technically challenged as I am using a laptop with a touchpad, so I added above calendar and all works!
Thanks.
Hi Ben,
This feature would be AWESOME--but what I've discovered is that using this script anywhere on my page (and I'm using SharePoint LMS, breaks the anonymous access to the page. When one is signed in, everything is viewable. Any ideas?
Thanks!
Post a Comment