Search code examples
sortingsharepointsharepoint-2010

How to change the Sorting order in SharePoint 2010 List view Web Part when Group by is applied?

Scenario:

  • I have created one custom list in my SharePoint 2010 Environment.
  • In this list, there is one choice column named Status and its values are New,Open and Closed.
  • On a page I have setup one view and applied Group By using this Status column.

Problem

  • View is rendering as shown in below image:

enter image description here

  • I want to change the order of this Status column and it should be rendered in this Sort Order : New, Open and Closed.

If I use Ascending Order it will be displayed as shown in above image and if I use Descending Order then it will be displayed like: Open, New & Closed.

Can any one help me how can I get the requested Sorting for this column? Is there any alternative way to meet my requirement?

Thanks in advance!

Solution

  • I searched on google and tried to find a solution but didn't find any proper solution. As far as I understand, OOTB it won't be possible to apply custom orders for the column which was used for grouping. You can sort them in Ascending order or Descending order only.

    But any how, I found a patch and I was able to meet the requirement using JQuery. I applied below JQuery code on the Page, it was working like a charm:

    JQuery Code

    $("table[summary='GTSRequests']").each(function(){
   var tbodyGroupCol = $(this).find("tbody[id*='GroupByCol']");
   var grpNew = $(this).find("tbody[groupstring='%3B%23New%3B%23']");
   var grpOpen = $(this).find("tbody[groupstring='%3B%23Open%3B%23']");
   var grpClosed = $(this).find("tbody[groupstring='%3B%23Closed%3B%23']");

   if(grpNew.length > 0){
      var strGrpNewId = grpNew.attr("id").replace("titl", "tbod") + "_";
      grpNew.insertAfter(tbodyGroupCol)
      $("#" + strGrpNewId).insertAfter(grpNew);
   }

   if(grpOpen.length > 0){
      var strGrpOpenId = grpOpen.attr("id").replace("titl", "tbod") + "_";
      grpOpen.insertAfter("#" + strGrpNewId);
      $("#" + strGrpOpenId).insertAfter(grpOpen);
   }

   if(grpClosed.length > 0){    
      var strGrpClosedId = grpClosed.attr("id").replace("titl", "tbod") + "_";
      grpClosed.insertAfter("#" + strGrpOpenId);
      $("#" + strGrpClosedId).insertAfter(grpClosed);
   }
});

    So basically using this Code, I am changing the location of HTML code and putting them as per my need. So that it looks like custom sorting.

    Hope this code will help other users.