Saturday, August 24, 2013

Expand only the first group and have the rest of the groups collapsed in Dataform webpart SP 2010

Now, it is possible in DVWP to expand only the first group and have the rest of the groups collapsed.
Example:-
- Group: Year 2013
- Item 1
- Item 2
- Item 3
+ Group: Year 2012
+ Group: Year 2011
+ Group: Year 2010

Use the following steps:-

1) Create dataform webpart using Sharepoint designer and bydefault group is collapsed in dataform webpart.
2) Save the page and search webpart id for dataform webpart in view source of page. E.g In my case it is  MSOZoneCell_WebPartWPQ4. Search the id for div available in webpart, <div id="WebPartWPQ4".
3) Use the following script on page and replaced the WebPartWPQ4   with your dataform webpart div id.
<script src="https://Server/SiteName/Style%20Library/Custom%20Javascript/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
functioncollapseGroups() {
var someimage = document.getElementById('WebPartWPQ4');     //Webpart Id available in div tag
var myimg = someimage.getElementsByTagName('img')[0];     //  It will check first group image(+) available in div tag
var mysrc = myimg.src;
   //alert(mysrc);
    //$("img[src='/_layouts/images/plus.gif']:visible").parent().click();
    $(myimg).parent().click();
}
_spBodyOnLoadFunctionNames.push("collapseGroups");
</script>

The script will find 1st + sign image available next to group first and forcefully fired the click event.

Bingo!!!!, the script is work properly and our issue resolved.

2 comments:

  1. I have a view grouped by 2 columns (first column: country, second column: county) Is it possible to expand all groupes for the country column and collapse the county groups?
    I've been searched all over the internet, but i can't find anything like that
    I hope it's okay to ask you about that. Thnaks in advance

    ReplyDelete
  2. It is possible using a script. Please write to me if you want to know more

    ReplyDelete