Remove Group Headers from SharePoint List View Webpart

We can hide the Group name in out of the box list view using the below Java Script.

Java Script (MOSS 2007/WSS 3.0):

        _spBodyOnLoadFunctionNames.push(“HideHeaders”);
        function HideHeaders() {
            var elements = getElementsByClassName(document, “td”, “ms-gb”);
            var elem;
            for (var i = 0; i

                elem = elements[i];
                elem.childNodes[3].style.display = “none”;
                elem.childNodes[4].nodeValue = elem.childNodes[4].nodeValue.replace(‘:’, ”);
            }
            elements = getElementsByClassName(document, “td”, “ms-gb2”);
            for (var i = 0; i

                elem = elements[i];
                elem.childNodes[3].style.display = “none”;
                elem.childNodes[4].nodeValue = elem.childNodes[4].nodeValue.replace(‘:’, ”);
            }
        }
        function getElementsByClassName(oElm, strTagName, strClassName) {
            var arrElements = (strTagName == “*” && oElm.all) ? oElm.all : oElm.getElementsByTagName(strTagName);
            var arrReturnElements = new Array();
            strClassName = strClassName.replace(/\-/g, “\\-“);
            var oRegExp = new RegExp(“(^|\\s)” + strClassName + “(\\s|$)”);
            var oElement;
            for (var i = 0; i

                oElement = arrElements[i];
                if (oRegExp.test(oElement.className)) {
                    arrReturnElements.push(oElement);
                }
            }
            return (arrReturnElements)
        }
    
Java Script (SharePoint 2010/SharePoint Foundation 2010):
        _spBodyOnLoadFunctionNames.push(“HideHeaders”);
        function HideHeaders() {
            var elements = getElementsByClassName(document, “td”, “ms-gb”);
            var elem;
            for (var i = 0; i

                elem = elements[i];
                elem.childNodes[0].childNodes[1].nodeValue = “”;
                elem.childNodes[1].nodeValue = elem.childNodes[1].nodeValue.replace(‘:’, ”);
            }
            elements = getElementsByClassName(document, “td”, “ms-gb2”);
            for (var i = 0; i

                elem = elements[i];
                elem.childNodes[1].childNodes[1].nodeValue = “”;               elem.childNodes[2].nodeValue = elem.childNodes[2].nodeValue.replace(‘:’, ”);
            }
        }
        function getElementsByClassName(oElm, strTagName, strClassName) {
            var arrElements = (strTagName == “*” && oElm.all) ? oElm.all : oElm.getElementsByTagName(strTagName);
            var arrReturnElements = new Array();
            strClassName = strClassName.replace(/\-/g, “\\-“);
            var oRegExp = new RegExp(“(^|\\s)” + strClassName + “(\\s|$)”);
            var oElement;
            for (var i = 0; i

                oElement = arrElements[i];
                if (oRegExp.test(oElement.className)) {
                    arrReturnElements.push(oElement);
                }
            }
            return (arrReturnElements)
        }
    

3 thoughts on “Remove Group Headers from SharePoint List View Webpart

  1. Joseph,
    Great code and it works great with one grouped list on a page but throws error when there is multiple grouped list, any idea how to overcome this?
    Thanks

    • John,

      By default SharePoint supports only 2 level group by. The style defined for the first level is in “ms-gb” and the second level in “ms-gb2”.

      If you customize your group by function with more than 2 use the below code in HideHeaders() function and replace “ms-gb2” with your style class

      elements = getElementsByClassName(document, ”td”, ”ms-gb2″);
      for (var i = 0; i < elements.length; i++) {
      elem = elements[i];
      elem.childNodes[1].childNodes[1].nodeValue = ”"; elem.childNodes[2].nodeValue = elem.childNodes[2].nodeValue.replace(‘:’, ”);
      }

      This should work

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.