Business Scenario
You have set up the Room and Equipment Reservations application template. Some resources are created, for example:
- Resource Name: Conference Room 1; Resource Type:Conference Room
- Resource Name: Conference Room 2; Resource Type:Conference Room
Some of your end-users start creating reservations, for example:
- Start Date: 24-03-2008 1 PM 00
- End Date: 24-03-2008 3 PM 30
- Resource: Conference Room 1
Those users would like to send out an appointment with Microsoft Outlook right away from within SharePoint, taking into account the data they have already provided upon creation of the reservation in SharePoint.
Solution
To achieve this, I combined some of my SharePoint knowledge, with a Javascript snippet I found on the web written by Brian White.
As prerequisite for the solution, Microsoft Outlook should be installed on the client machine with which the SharePoint site is being accessed.
- Open the MyReservations.aspx page with Microsoft SharePoint Designer 2007.
- Right-click the ListViewWebPart and choose Convert to XSLT Data View.
- Right-click the last column of the created grid, and choose Insert -> Column to the Right
- Give the column the title Outlook Appointment.
- Go to the code view.
- Insert right after the PlaceHolderMain tag following code snippet:
<script type="text/javascript">
function createOutlookAppointment(title,meetinglocation,startdate,enddate)
{
newAppt = new appt(title, meetinglocation, formatIncomingDateTime(startdate),
formatIncomingDateTime(enddate));
saveAppt( newAppt );
}
function formatIncomingDateTime(incomingDateTime){
var datePart = incomingDateTime.substring(0,10);
var timePartHours = incomingDateTime.substring(11,13);
var timePartMinSecs = incomingDateTime.substring(13,16);
timePartHoursInt = parseInt(timePartHours,10) + 1;
timePartHours = timePartHoursInt.toString();
return datePart.concat(' '.concat(timePartHours).concat(timePartMinSecs));
}
function appt( Subject, Location, Start, End){
this.Subject = Location;
this.Location = Location;
this.Start = Start;
this.End = End;
this.ReminderMinutesBeforeStart = 15;
}
function saveAppt( obj ){
var olAppointmentItem = 1;
out = new ActiveXObject( "Outlook.Application" );
appt = out.CreateItem( olAppointmentItem );
appt.Subject = obj.Subject;
appt.Location = obj.Location;
appt.Start = obj.Start;
appt.End = obj.End;
appt.ReminderMinutesBeforeStart = obj.ReminderMinutesBeforeStart;
appt.Display();
return null;
}
</script>
- Go to the <td> tag of your newly created column (search for Reserved By, it will be a couple of lines beneath it). Add a button which will execute previously created code snippet:
<input type="button" value="Outlook"
onclick="javascript:createOutlookAppointment('{@Title}','{@Resource}',
'{@RERStartDate}','{@REREndDate}');return true;"/>
As a result the users will have next to each reservation a button.
Clicking on the button will create a Microsoft Outlook appointment with the data previously entered upon creation of the reservation in Microsoft SharePoint.
You can extend the Reservations list, by adding additional columns, whose data could be added upon creation of the Microsoft Outlook appointment.
View my profile
Hi - thanks for this great extension!
I figured out a problem with the time.
If the Startdate or Enddate is 10 AM or 11 AM - Outlook shows up with a Starttime and Endtime at 1 AM...
The other hours work fine - exept for these two.....
I tried to catch an exeption but it didn`t work - could you please give me some feedback!
--Kai
Hi Kai,
Thanks for mentioning: apparently there was still a bug in my solution.
Replace the line timePartHoursInt = parseInt(timePartHours) + 1; with following line: timePartHoursInt = parseInt(timePartHours,10) + 1;
I updated the post aswell. I am giving an extra parameter (the radix) to the parseInt function to make it clear for it that I am giving it a decimal value and not a -default- octal input.
Hi,
This is a great feature. I just added the code and the button appears, however when I click on the button, I get an error message at the bottom left side of the browser. Any idea what I should check for?
Hi,
what is the exact error message?
The error appears in the browser and it only says "error". Do you know of a way to check for errors in Sharepoint Designer?
I was able to get the error message. It says "Automation server can't create object." Line 496 Char 1 Code 0
Hi,
I guess your activeX controls are not allowed in your browser settings. Please try to play around with those activeX control settings in your browser: may help to fix your problem.
Great read, I went to apply and am very new to SharePoint designer, on your screenshoot on number 2. ListViewWebPart where can i find this. I dont show it off the bars on the top. Thank you
Hi Pam,
You have to click on the webpart displaying the contence of your list. Clicking in it will select it completely in your SharePoint Designer Design view. Then you can right click it: a contextual menu will appear, which is mentioned in my step 2.
Thank you very much for the additional guidance. It appears that is this using a local install off of your desktop outlook client. Do you know if you use this with Exchange server for shared resources? Also can you put this on to the main page instead of off my reservation site? I was also having issues with times booking correctly any suggestions. Thank you again
Hi Pam,
indeed it is using the local Outlook client. I haven't used or tried this solution with Exchange server, but to be honest, I doubt if this will work.
To put this on the main page, I would take a look at the Content Query Web Part: you'll be able to put the data of your reservation list at least on your main page. With some tweaking of the XSLT of the CQWP, maybe you'll be able to add the Outlook button aswell, but I am not sure of the latter.
Hi
whein I click outlook button then java script error automation server canot create object
I'm having the same Outlook "Automation server can't create object" issue. When I run the Infopath form from my computer as a preview of a design template, it's good. But, when I run the same form from Sharepoint on my server, that's when it can't create the "object".
Any help on this?
Elgin
Hi Elgin,
I can simulate this error if I click No on the warning message box which appears upon opening the page which says: "An ActiveX control on this page migth be unsafe to interact with other parts of the page.
Do you want to allow this interaction?"
If I choose No, then I get the "Automation server" error, if I choose Yes, everything works as it should.
I don't know if this helps you further.
I want to make it so that other people cannot delete reservations made by others. For example, I reserve the Conifer Room. Someone in Marketing should not be able to delete my reservation. Is it possible to have permissions to that level? I want people to be able to create a reservation, just not delete ones they didn't make.
Go to the reservations list and choose Settings -> List Settings. Go to Advanced Settings under the section General Settings. You'll have a section Item-level Permissions where you can specify that users can only edit their own items. Guess this is what you want to achieve?
Sounds like it - thank you.
Adding an appointment to Outlook is fine, but has anybody worked out a way for this appointment to be updated when meeting details are altered? Is this too much SharePoint/Outlook integration?
Thanks for this great article. I have a question.
When you click the button for the second time, a browser error appears.It says "Object doesn't support this property or method". When i see the line on the error, is:
newAppt = new appt(title, meetinglocation, formatIncomingDateTime(startdate), formatIncomingDateTime(enddate));
Could be (maybe) a problem trying to instanciate the same object twice?
Could be: I've never tried to push the button twice.
Maybe some check can be implemented to see if the object is already instanciated, but I don't have an answer straight away to that.
If you would fine a solution for it, I would greatly appreciate your feedback here.
I have an error i can't fix. it says Line 545 error
Char: 3
Error: Automation server can't create object
Code: 0
Please help me to fix this problem.
Did you put your SharePoint site in the Trusted sites (for Internet Explorer: go to Tools->Options->tab Security and select Trusted sites. Push the Sites button and add your SharePoint site to the list)
Where on earth are you guys finding this .aspx file to open? i only have the .wsp file. i'm very confused.
Open your site with Microsoft Office SharePoint Designer: you'll be able to edit the .aspx page with this tool.
Hi there,
I am using Room & equipment reservation template.
to reserve a room i have start date and end date. what i need is...
Start date : Should be equals to or greater than today's date.
how can i do that.
any help will be highly appreciated.
Thank you
I would add the Content Editor Web Part to the Web Page where you want to do the validation. In the CEWP, I would add some Javascripting to do the validation.
An example of this technique can be found in one of my posts (it is not for a validation, but the technique is the same): Add url to the Description of a SharePoint column.
Where can I find the solution package.
Hi, Patrik. Thanks for your work! There's only one problem. I'm from Moscow and my datetime format is ddmmyyyy hh:mm.
First of all, i made this correction in your code:[timePartHoursInt = parseInt(timePartHours,10) + 3];
Everything was fine, but I have a bug only with 10:00. If startdate is 10:00 and endtime is 10:20 system takes it like 7:00 and 7:20 - it's ok for me, because i'm adding 3 hours. But for: 10:00 - 12:00 it goes like 06:00 and 08:00 (so for me it's 09:00 and 11:00). Can you tell me what's wrong with it? TIA.
This is a great post! I would love to put the same type of button on the newform.aspx page, but can not get it working. I keep getting an error, think I'm having trouble referencing the form fields.
Hi Patrik,
How to display a tooltip in the reserved area(highlighted with Purple color in the templated).
I just wanted to display {@Reserved_by}, when i use this in xslt it is displaying the author of Resource created instead of the author of item created under "Reservations" List.
Thanks in advance
Hi,
I don't know right away, but maybe you could take a look at my post Add url to the Description of a SharePoint column: in it I describe how to add a hyperlink through the CEWP to a column: you could easily add a tooltip aswell to it. But you'll have to adapt it to be able to add something to the reserved area. At least the post could give you an idea or a starting point how you maybe could achieve your requirement. Success!
Hi Patrik,
In the above :-- display a tooltip in the reserved area(highlighted with Purple color in the template).
I'm using wss 3.0 Room and Equipment Booking Template, for me it's gonna be a big issue to display "Reserved By " in the tool tip, Please let me know if any one knows about this.
TIA
Jam
Hi Patrik,
Thanks, I just added this to my SharePoint 2010 site and it was a big help! I wanted to point out some changes I needed to make in the code:
1) In the appt() function, this.Subject is populated by the Location parameter instead of Subject.
2) I had the same problem as a previous commenter where the button only worked properly on the first click per page load (for me, subsequent clicks created an empty appointment). I don't know why (JavaScript is not my strength) but I had to remove appt() and rewrite createOutlookAppointment() as follows:
function createOutlookAppointment(title,meetinglocation,startdate,enddate)
{
appointment = {
Subject : title,
Location : meetinglocation,
Start : formatIncomingDateTime(startdate),
End : formatIncomingDateTime(enddate),
ReminderMinutesBeforeStart : 15
};
saveAppt( appointment );
}
3) Maybe I wired the onclick event incorrectly, but my datetime format was not as predictable (no leading zeroes). So I rewrote formatIncomingDateTime():
function formatIncomingDateTime(incomingDateTime)
{
var spacePosition = incomingDateTime.indexOf(' ');
var colonPosition = incomingDateTime.indexOf(':');
var datePart = incomingDateTime.substring(0,spacePosition);
var timePartHours = incomingDateTime.substring(spacePosition+1,colonPosition);
var timePartMinSecs = incomingDateTime.substring(colonPosition,colonPosition+3);
timePartHoursInt = parseInt(timePartHours,10) + 1;
timePartHours = timePartHoursInt.toString();
return datePart.concat(' '.concat(timePartHours).concat(timePartMinSecs));
}
4) Lastly, I had to enable the "Initialize and script ActiveX controls not marked as safe for scripting" security setting in Internet Explorer 9. Our SharePoint site is already in the "Local intranet" security zone. I wouldn't want to enable that setting for the Internet zone.
Thanks again and I hope this helps someone else!
Post a Comment