in

SharePoint Blogs

The Best Place for SharePoint-related Blogs

This Blog

Syndication

ChadClarkesMOSSBlog

Solution for multiple filters... (Javascript/Forms Solution)

This was a post on Discussions in microsoft.public.sharepoint.development_and_programming.  This may not be the most complete solution, but you will not have to use custom web parts to implement.  Ok so, we want three different columns we can filter on for a basic list web part that can only connect to one web part at a time...  Well, as long as we only want one of the columns to search on at a time....  We can do a little slap and tickle(Beer Fest, good movie).  So the solution here would be to use a forms web part to put a drop down on the page, then place three identical list web parts on the page and three text filter web parts.  Set up the appropriate connections between each set of webparts.  Write some javascript code to hide/show the appropriate web parts based on the dropdown selection, and there you have the ability to search on multiple columns from one list using the default sharepoint filtering capabilities.

So this script below should get you on your way.  I developed formatList in order to place a tab type menu inside of a sharepoint page, but it should work for this application as well.  Place this text inside of a form web part for the dropdown menu.  You can minimize all the filtered web parts to start with.  Good luck and god bless your journeys in the World of SharePoint!

<div onkeydown="BLOCKED SCRIPTif (event.keyCode == 13) _SFSUBMIT_">

<select name=searchType onChange="show(this.selectedValue)">
<option value='column1'>Column1</option>
<option value="column2">Column2</option>
<option value="column3">Column3</option>
<option value="column4">Column4</option>
</select>

</div>

<script>
function removeTitle(listName){
 var tds = document.getElementsByTagName('td');
 for(var j = 0; j < tds.length; j++){
  if(tds[j].title.indexOf(listName) != -1){
   var minimizedWebPart = tds[j].parentNode;
   minimizedWebPart.style.display = "none";
   break;
  }
 }
}
//Use this if publishing is enabled on this site, otherwise just check the hyperlinks for "exit edit mode" link.
var EditMode = false;
var publishingMenu = document.getElementById("ctl00_SPNavigation_ctl01_toggleContainerColorBar");
if(publishingMenu)
 EditMode = true;

//if edit mode clear titles
if(EditMode == false){
  removeTitle('WebPart1');
  removeTitle('WebPart2');
  removeTitle('WebPart3');
}

function show(webpartTitle){
  formatList(webpartTitle, 300, true, true)
   //script to hide other windows...
}

function formatList(listName, height, scrollable, display){
 var tds = document.getElementsByTagName('td');
 var webpartZone;
 var webpartRow;
 for(var j = 0; j < tds.length; j++){
  if(tds[j].title.toLowerCase().indexOf(listName.toLowerCase()) != -1){
   webpartZone = tds[j].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;   
      webpartRow = webpartZone.parentNode.parentNode.parentNode;
     }
 }
 if(webpartZone){
  webpartRow.style.display = display;
  var bodyDiv = webpartZone.children[1].children[0].children[0];
  if(scrollable){
   bodyDiv.style.height = height;
   bodyDiv.style.overflow = "auto";
   bodyDiv.style.display = display;
  }
 }
}


</script>



 

Comments

 

Sivakumar said:

very useful

thanks

August 21, 2007 2:50 PM
 

hosthg » Blog Archive » Solution for multiple filters… (Javascript/Forms Solution) said:

Pingback from  hosthg  &raquo; Blog Archive   &raquo; Solution for multiple filters&#8230; (Javascript/Forms Solution)

October 22, 2007 5:33 AM
 

Tim said:

Hi - What is a "text filter web part"? Being very new to SharePoint I am having trouble with the terminology. Do you have a picture to show how the web parts are linked in your example?

I am getting a light bulb symbol after each "tds"  in the code - what should it be?

October 31, 2007 10:52 PM
 

ChadClarke said:

A text filter web part is a web part that comes with sharepoint.  You should be able to utilize this script with any filter web part that comes with sharepoint.  No, I don't have any pictures I apologize.  The smiley face was in place of [ i ] an array tds with an index of i.  I went ahead and changed the index variable to j, to eliminate confusion.  If you need further help with the scenario, please let me know.  

November 1, 2007 8:35 AM
 

javascript form style display said:

Pingback from  javascript form style display

May 14, 2008 1:38 PM
 

Anders said:

I don't have any web parts named filter, text filter or anything like it :/ Could you use another web part?

June 11, 2008 4:31 AM

Leave a Comment

(required )  
(optional )
(required )  
Add

Need SharePoint Training? Attend a SharePoint Bootcamp!

Posts (c) their respective authors. Everything else (c) 2007 SharePoint Experts