The SharePoint Web Part Visibility Filter Web Part is a web part that selectively hides or unhides web parts on a page based on dynamic criteria, such as a value from a web part connection, value in a query string, or value in the current user's profile.

While standard SharePoint "filter" web parts can be used to determine what information is displayed inside a web part, this web part allows you to determine which web parts get displayed on the page.

It provides a function similar to assigning an Audience to a web part in MOSS, which can be used to selectively hide web parts based on Audience membership, but can be more flexible and dynamic.

For example, you can configure the web part to hide all web parts containing "Summary" in their title when the query string contains "Level=Detail". Or you can create a page that has a hidden web part that displays only when the Department field in the user's profile is "IT". Or you can have a web parts that appear only when a certain value is selected in a filter web part or a list view web part (acting as a filter).

This can solve a number of problems when creating data driven web part pages, such as dashboards.

Here is a very simple example. Let's take this site, which has three web parts (Content Editor Web Parts):

screen1.jpg

Let's say we want to display information about a state based on a user's selection using a Sharepoint list view web part as a filter. We only want information for the selected state to display, not all three like above.

Step 1. Create a Sharepoint list called "States" and populate it with the values Pennsylvania, New Jersey, and Delaware and drop a list view web part on the page.

screen2.jpg

Step 2. Modify the three state-specific web parts so they are all Hidden.

screen3.jpg

Step 3. Add three SharePoint Web Part Visibility Filter Web Parts to the page, one for each state. These must be placed above the three state-specific web parts. They can be placed anywhere on the page, but they must be in a zone with a number lower than the zone containing the web parts to hide/unhide or be in a position above (lower numbered Zone Index) the web parts to hide/unhide if they are in the same zone. Also, it is best to change the title of the Visibility Filter web parts so you know what each one is for.

screen4.jpg

Step 4. Connect the State list view web part to each of the three SharePoint Web Part Visibility Filter Web Parts, so they receive the value selected in the web part via the connection. Send the column "Title" to the web part.

screen5.jpg

Step 5. Configure each of the SharePoint Web Part Visibility Filter Web Parts to make the appropriate web part visible based on the state name received via the connection. This is an example of how one of them would be set up (when the value Pennsylvania is received).

Step 5.1. Open the "Trigger" section of the web part configuration. Set the fields to the following:

Data Source: Connection
Data Source Comparison Type: Equals
Compare Data Source Value To: Pennsylvania

Note: Data Source Field is not used with a connection.

screen6.jpg

Step 5.2. Open the "Web Part Selection" section of the web part configuration. Set the fields to the following:

Compare Web Part Field: Title
Web Part Field Comparison Type: Contains
Compare Web Part Field Value to: Pennsylvania
Do this to the Web Parts When True: Show

This is configuring the web part to: When the value "Pennsylvania" is received via the connection, compare the Titles of all web parts on the page and if any contain "Pennsylvania", change the visibility of those web parts to Visible (show them). All others will remain unchanged.

screen6-2.jpg

Repeat this setup for the two other states, substituting the other state names.

Now when you use the page, you can choose a state in the list view web part and the appropriate state's web part will display, and only that state's web part.

screen7-2.jpg

screen7.jpg

Some things to keep in mind when using this web part:
  • The web part needs to render itself before the web part(s) that may be affected by it (hidden or unhidden), so you need to place it in a zone above the potentially affected web parts.
  • This web part does not actually generate any visible HTML output to the page (it affects other web parts) but can emit Javascript to the page. By default, when it is placed on a page, its visibility is automatically set to Hidden. The Javascript it generates is to modify the titles of web parts that it is unhiding (if any). SharePoint adds the string "(Hidden)" to any web parts that are initially hidden and that remains even if this web part unhides them, so it generates Javascript to find the titles of those unhidden web parts and removes the "(Hidden)" string from their title.
  • You may need to include multiple instances of this web part on a page to selectively hide/unhide web parts. Using the above example, you may want to have one of these web parts that hides all web parts containing "Summary" in their title when the query string contains "Level=Detail" and another that hides all web parts containing "Detail" in their title when the query string contains "Level=Summary".
  • Although this web part can dynamically hide other web parts, those web parts will still internally "render". They are hidden using the SharePoint web part API (not via CSS or Javascript on the page) so the data from the web part will not be generated on the page at all, but SharePoint will still "execute" the web part code, so hiding it will not reduce any significant load on the server. In other words, if you have a web part such as a Data View Web Part that queries a SQL database, it will still query the database even if this web part hides it, although the result of the rendering will not be output to the browser. That is to say, if you have 10 web parts on a page and this web part hides 5 of them, except for the time it takes to load the page in the browser, the page will not render much faster because those 5 web parts are hidden. From the server side, it would be as if all 10 web parts were still on the page.

Last edited Aug 2, 2009 at 8:00 PM by JoeD, version 20