Social Icons

twitter google plus linkedin rss feed

Pages

8.7.11

Hiding List View web parts when they are empty

Today I have been required to hide the List View web parts of the solution when they are empty… Even though I don’t like javascript, it was the obvious way to go so I asked Google and it sent me to this post.

I copied the code to a Content Editor Web Part and it worked more or less, but when I tried to hide the column headers and adding a message instead it was only working for two of my the three listview web parts in the page… After a bit more of googling I changed it to:

<script type="text/javascript">
 function HideEmptyWebParts()
 {
   var itemsfound = new Array;
   var elements = document.getElementsByTagName('*');
   for(var i=0;i<elements.length;i++)
   {
      if(elements[i].className == 'ms-vb')
      {
         itemsfound.push(elements[i]);
      }
   }
  
   for (var i=0;i<itemsfound.length;i++)
   {
       if (itemsfound[i].innerHTML.indexOf("There are no items to show in this view of the")>-1)
       {
                itemsfound[i].parentNode.parentNode.parentNode.parentNode.innerHTML="<div class='ms-vb'>Not enough data to produce a dashboard.</div>";
         
       }
   }
 }

_spBodyOnLoadFunctionNames.push("HideEmptyWebParts")
 
</script>

And after that it worked as expected.