SharePoint Application Development: Using XML Web Services in SharePoint Designer

I noticed that I had promised better details on a previous post, so I have decided to include step by step instructions on building a solution that queries an XML web service for data and displays that information in SharePoint 2007. I apologize that it has taken me two years to get back to this, and I hope you will still find this information valuable.

In the post, I described how I used SharePoint Designer to query an XML web service to build a course roster system for our professors. This is a very simple solution that allows a faculty member to go to SharePoint and display their courses and view the students enrolled in that course from data in our ERP system.

Starting in SharePoint designer, I open the site where this solution would be placed. The site I’m using has a Pages document library, but any document library should work.

I need two pages: one to display the available courses and another to display the students enrolled in the course. A page can be created by right clicking on the window and choosing new aspx page. Following this process, I create these two pages: CourseRoster.aspx and StudentsInCourse.aspx.

Now, the web service data sources need to be created. I begin by opening Manage Data Sources from the Data View menu. This opens the Data Source Library task pane. I locate the XML Web Services node and expand it. Next, I click on Connect to a web service…

The data source properties window will open and show the Source Tab. To help identify this data source, I begin by going to the General Tab and providing a name that is more descriptive than the default one that will be created.

On the Source tab, I provide the details on how to contact the web service, connect to the web service by clicking on Connect Now and select the appropriate method. (Notice that you do have the ability to use web services to update data as well, but this is beyond the scope of this post.). Any parameters that are needed for the web service will be displayed in the parameters box at the bottom of the dialog.

So that I can customize the parameters sent to the web service, I need to make modifications to the parameters. I click on the parameters that will need to allow to be set dynamically and then click on Modify. In this case, the Login will need to be provided dynamically; However, for simplicity, I will only be using the default value for this data source.

When I click on Modify, the parameter properties dialog will open. I insure the checkbox for The value of this parameter can be set via a Web Part connection is checked and provide a default value to use for the initial query of the data source. When the values are set correctly, I click OK to close the dialog.

If the web service required authentication, I would change properties on the Login tab. Fortunately, the web service that I am using does not require authentication, so I click OK to create the new data source.

This data source will be used to get the list of courses for a specific professor. Since the same web service also has a method to get the students currently enrolled in the course, I can simply make a copy of this web service and modify the settings appropriately.

To do this, I right click on the web service I just created and choose Copy and Modify. Again, I change the name on the general tab to provide a better name for the data source. In my case, this one is called StudentsInCourseWebService. On the source tab, I click reconnect and choose the new method to use. Again, I need to modify the parameters. This web service method expects a parameter named SYN. This is the unique identifier of a course in our organization, so it will need to be provided dynamically.

Now I have both of my web service data sources ready, it’s time to use the data! First, I open the CourseRoster.aspx page in SharePoint designer. A blank ASP.NET page is displayed. With the page active, I open the data source library task pane and locate the data source that queries the courses for the current professor. I right click on it and choose Show Data.

This queries the web service using the default value and returns the results in the Data Source Details task pane. Now, I CTRL-Click on all the fields that will need to be displayed on the data source and then click on Insert Selected Fields as… > Multiple Item View

The CourseRoster.aspx page now displays a list of available courses using the default value provided to the web service.

I want the professor to be able to click on the course number to open the course and view currently enrolled students. To do this, I move the mouse cursor over one of the items in the CourseNumber row and look for the task widget (I’m not sure what the actual name of it is, but it’s a little gray arrow).

I click on the widget and the properties of this field are be displayed. I need this to be a hyperlink, so I choose Hyperlink in the Format As dropdown.

A message warning me hyperlinks should only be used in a trusted environment appears. I click Yes to confirm the creation of a hyperlink and the hyperlink properties window is displayed. I will leave the text to display as {CourseNumber}, but I need to change the Address to StudentsInCourse.aspx?SYN={SYN}. I confirm this by clicking on OK.

I now move to the StudentsInCourse.aspx page and make sure it is the active page in SharePoint designer. I reopen the Data Source Library task pane to locate the data source that gets the students in a specific course. Right clicking on it, as before, I choose to Show Data. Again, I choose the columns to display and click on Insert Selected Items As Multiple Item View. There is now a list of students for the default value provided in the data source. This is not the desired result, so I need to specify a source for the parameter. I locate the widget for the data source and click on Parameters.

The SYN parameter is available, I just need to specify the source. This is done be choosing Query String in the parameter source drop down and setting the Query String Variable to SYN.

Now, it’s time for testing. To insure that everything is working, I save everything and go back to the CourseRoster.aspx page and click on the preview button on the toolbar.

This opens Internet Explorer to the CourseRoster.aspx page with a list of courses. I can click on a specific course to view the students enrolled in the course.

Finally, I need to apply the SharePoint master pages to these pages. To do this I go back to SharePoint Designer and click on Format > Master Page > Attach Master Page. I choose to attach the Default Master and match any content regions that need to be setup.