Expand-Collapse All Groups in SharePoint 2013 List Views using jQuery

SharePoint doesn’t have the ability to expand/collapse all groups in grouped list views. However, with jQuery we can bring Expand All-Collapse All buttons in SharePoint 2013 grouped list views. Just edit the grouped view page (Site Actions Gear >> Edit Page), add a “Script Editor” Web part and then place the below code in it.

jQuery for Expand-Collapse all items in grouped views in SharePoint

<script type="text/javascript" src="https://code.jquery.com/jquery-1.2.6.min.js"></script>

<script type="text/javascript">  
    function expandAll() {
        $("img.ms-commentexpand-icon").click();
    }

    function collapseAll() {
        $("img.ms-commentcollapse-icon").click();
    }

    var expandButton = "<a href='#' onClick="
    +'"' + "this.href='javascript:expandAll()'"
    + '">&nbsp;<img title="expand all groups" style="border:none;" alt="expand all" src="/_layouts/images/collapseplus.gif"></a>';

    var collapseButton = "<a href='#' onClick="
    +'"' + "this.href='javascript:collapseAll()'"
    + '">&nbsp;<img title="expand all groups" style="border:none;" alt="collapse all" src="/_layouts/images/collapseminus.gif"></a>';

    $(document).ready(function () {
        $(".ms-pivotControl-container").append(expandButton).append(collapseButton);
    });
</script>

and here is the result:

Expand-Collapse All Groups in SharePoint 2013 List Views using jQuery

Thanks to: https://www.nothingbutsharepoint.com/sites/eusp/pages/jquery-for-everyone-expandcollapse-all-groups.aspx for the idea!

Salaudeen Rajack

Information Technology Professional with Two decades of SharePoint Experience.

22 thoughts on “Expand-Collapse All Groups in SharePoint 2013 List Views using jQuery

  • January 28, 2019 at 7:58 PM

    Fantastic! Thank you!

    Reply
  • October 15, 2018 at 9:35 PM

    Outstanding product, but I have one concern; it doesn’t work with web parts (or at least I can’t get it to). Any suggestions?

    Reply
    • October 16, 2018 at 3:15 PM

      NM, I modified where the expand and collapse buttons get appended to, and put them with ms-list-addnew, and then chose full toolbar for the webpart. Now I’m tackeling the challenge of only applying this a singular webpart instead of all webparts because the code is conflicting with other code (Hillbilly’s Tabs). I tried using the code as a .js and using the JS Link but to no avail.

      Reply
  • April 6, 2018 at 6:16 PM

    Can you help with targeting a specific web part on the page? I have 3 web parts on the page with groupings, and I want this to only expand and collapse the groupings of one web part.

    Reply
  • April 5, 2018 at 8:14 PM

    How can I have this target one specific web part? I have 3 web parts on my page with groupings, and I just want this to work on one.

    Reply
  • March 1, 2018 at 4:45 PM

    Works cool.. thank you . you are a hero!

    Reply
  • February 7, 2017 at 8:04 PM

    Looks like the script worked well one level grouping, But if we have second level grouping then it breaks.

    Reply
  • February 1, 2017 at 5:56 PM

    Thank you so much!! This article was really helpful. Best Regards,

    Reply
  • April 12, 2016 at 6:11 PM

    This works great with Standard View.
    It doesn’t work on Datasheet View though.
    How do I make it work on Datasheet View?
    I am using SharePoint 2013.
    Thanks!

    Reply
  • March 22, 2016 at 1:50 PM

    Thanks for your beautiful article. it works perfectly for SharePoint 2013 List. However it is not working for SharePoint 2013 Form library. do u have any break fix for this?

    Reply
    • March 22, 2016 at 1:58 PM

      Just verified that it works on SharePoint 2013 Forms Library! Let me know what difficulty you are facing.

      Reply
  • November 23, 2015 at 4:16 AM

    I have done all as suggested and it works great…..for me only? The buttons only appear on my screen and not on anyone else’s. Is this an permissions issue or is there something else causing it?

    Reply
  • November 18, 2015 at 8:50 AM

    5 you
    i use it
    perhaps control on view grouped or not, and hide in function

    Reply
  • October 8, 2015 at 7:51 PM

    This works beautifully!
    Thank you.

    Reply
  • January 7, 2015 at 1:09 PM

    I wish you a good year 🙂

    I have a questions: Unfortunately it doesn’t work for a gantview. Are they any possibilities to make it work? 🙂

    Thanks

    Reply
  • December 5, 2014 at 6:48 PM

    Works great! Only issue so far is that the +/- sometimes disappear behind the “Find an item” box if there are multiple view tabs.

    Reply
  • October 13, 2014 at 8:52 PM

    Wonderful!!!! Exactly what I was looking for – an updated expand/collapse script that could be used in Office 365. Thank you! If anyone else is like me and wants to get rid of the little underscore that shows up when you hover on one of the expand/collapse images, you can add a style attribute of text-decoration:none to the anchor tag.

    Reply
  • September 10, 2014 at 12:10 AM

    Is there any way to show Totals when the groups are collapsed?

    Reply
  • September 9, 2014 at 1:40 PM

    Thanks a lot worked like a charm …..

    Reply

Leave a Reply