SharePoint: Hide a web part with zero rows

 

(I wrote this up a few months ago, and then forgot to post it. So here it is finally!)

 

Here’s a JavaScript trick to hide a list or library web part when there are no items in the list, or the current view used in the web part.

 

Steps:

• On the same page as your web part, add a Content Editor Web Part (CEWP)
• Select Edit and then Modify Shared Web Part
• In the Advanced section set the Chrome to none
• Click the Content Editor button and add the JavaScript from below
• Replace "Test List" with your web part's name
  (If you don’t know the name or your guess does not work, view the HTML source of the page (View, Source in IE) and do a search for “summary=”.)

Note that the commented out section can be used to just hide the title bar instead of the entire web part.

 

<script>
function HideWebPartWithZeroRows()
{

  var a = document.getElementsByTagName("TABLE")
  for (var i=0;i<a.length;i++)
  {
    if (a[i].summary=="Test List")
    {
      if (a[i].rows.length==1)
      {
        //hide all but the title bar
        //var x =  a[i].parentNode.parentNode.parentNode.parentNode.parentNode

        //hide the entire web part
        var x =  a[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode

        x.style.display="none";
      }
    }
  }

}

_spBodyOnLoadFunctionNames.push("HideWebPartWithZeroRows") 

</script>

 

 

.