SharePoint: Extending the DVWP – Part 30: Using EasyTabs with Filtered DVWPs to Make Data Manageable

Author: Jim Bob Howard

If you’ve been following along with the Extending the DVWP series, you might be wondering, "Why is he doing all of this?" The whole point of this project was to make things easier for managers to update the number of full-time employees in their department. The administrative assistant who is collecting that data for reporting needs it all in one Excel spreadsheet to run some percentages, etc.

But the managers themselves only need to update their own site, so they don’t need the Excel spreadsheet with access to the other 14 locations just to be able to update their own.

Making it Easy with EasyTabs

Now that we have this robust DVWP, wouldn’t be great to break each location out into its own tab so the managers can just edit their own?

Well, no it’s actually not that great. There’s so much data that the overhead involved to load it all in multiple tabs, so that a manager can just pick their own tab, is completely overwhelming. Plus, in my requirements, several of the managers are responsible for staffing at multiple locations. Additionally, there are categories of employees that are not "really" full-time employees, but count as a fraction of a person, or not at all but still need to be maintained in the same list.

All that to say, that the better implementation for our purposes is to create multiple pages with multiple (though a subset of the whole) tabs.

Like this:

A page with one tab

A page with a few tabs

A page with several tabs

… etc.

So, what I’m going to do is use Christophe Humbert’s EasyTabs to stack multiple DVWPs on a page, each filtered on a subset of the FTE data.

Easy Part – Filtering

To filter a DVWP:

1. In SharePoint Designer (SPD), hover over the DVWP in the Design pane and click the chevron (right arrow), and click on the Filter: link.


2. This will bring up the Filter Criteria dialog box:


3. To add a new filter clause, simply do as it says and "Click here…"


4. Select the Field Name you want to filter, the comparison you want to make, and the value


5. Click OK and your DVWP will be filtered.

Let’s do one more filter and then we’ll stack them with Easy Tabs.

More Complicated Filters

In my implementation, I have several categories of employees that count as a portion of an FTE, but aren’t supposed to be included with the rest; they’re all supposed to be grouped together. Here’s how I filter them:

Location columns are grouped

Notice that all of the Location filters are OR’ed together and grouped. The result of that is AND’ed with Group = ‘ACB’.

To group them:

1. Click the arrow next to the top clause
2. Holding down the Shift key, click the arrow next to the bottom one
3. The Group button will now be clickable


4. Notice that the Filter setting now begins with ( Location Equals ‘Float’ Or …)

Filter: ( Location Equals ‘Float’ Or Location Equals ‘Trainee’ Or Location Equals ‘Temp’ Or Location Equals ‘PT’ ) And Group Equals ‘ACB’

Your filter on this DVWP now will show all list items with Group=’ACB’ and Location one of: ‘Float,’ ’Trainee,’ ’Temp,’ or ’PT.’

The Need for Tabs

Without Easy Tabs, my DVWPs just stretch down the page:

With Easy Tabs, they’re stacked for easy readability and accessibility:

Implementing Easy Tabs is extremely easy:

1. Download the javascript from Christophe Humbert’s Path To SharePoint site (at this writing, 5.0 beta is the current version)
1. At the link above, choose your options:


2. As soon as you check the License box, your version of the code will appear in the box at the bottom of the page
2. Copy it and paste it into the Source Editor of a CEWP on your page
3. Click OK and Exit Edit Mode

All of a sudden, all of the webparts in the same zone as the Easy Tabs webpart will be stacked with tabs.

Next time: A little more clean-up of our DVWPs are necessary; we need to fill in default data for the page/tab, activate the cascading dropdowns with default data, modify the Total and Subtotal rows… we’ll cover those over the final few articles of Extending the DVWP.

Author: Jim Bob Howard

Jim Bob Howard is a web designer / webmaster in the healthcare industry. He has been working with SharePoint since March 2009 and enjoys sharing what he has learned. He is a moderator and frequent contributor to Stump the Panel, and answers SharePoint questions on Twitter (@jbhoward) and via email ([email protected]).