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, we can bring Expand All-Collapse All buttons in SharePoint 2013 grouped list views with jQuery. 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()'"
    + '"> <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()'"
    + '"> <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

Salaudeen Rajack - Information Technology Expert with Two-decades of hands-on experience, specializing in SharePoint, PowerShell, Microsoft 365, and related products. He has held various positions including SharePoint Architect, Administrator, Developer and consultant, has helped many organizations to implement and optimize SharePoint solutions. Known for his deep technical expertise, He's passionate about sharing the knowledge and insights to help others, through the real-world articles!

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

  • Fantastic! Thank you!

    Reply
  • 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
    • 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
  • 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
  • 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
  • Works cool.. thank you . you are a hero!

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

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

    Reply
  • 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
  • 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
    • Just verified that it works on SharePoint 2013 Forms Library! Let me know what difficulty you are facing.

      Reply
  • 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
  • 5 you
    i use it
    perhaps control on view grouped or not, and hide in function

    Reply
  • This works beautifully!
    Thank you.

    Reply
  • 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
  • Works great! Only issue so far is that the +/- sometimes disappear behind the “Find an item” box if there are multiple view tabs.

    Reply
  • 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
  • Is there any way to show Totals when the groups are collapsed?

    Reply
  • Thanks a lot worked like a charm …..

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *