GroupBy and Sort simultaneously


Hi,



 I’m using grouping functionality but after grouping, when i do sorting on any column the the rows from the last group comes at the top of grid and sort doesn’t apply on them.



For initializing and loading the grid I’m using following functions:



//For initialization



function doInitEarningsGrid(sClientId,columnNames,noOfFixedColumns,noOfVariableColumns,flag,showEmpId,payrollType,regularHourDesc)
  {
   
   //for add
   localPayrollType=payrollType;
   localFixedAdd=noOfFixedColumns;
   localVaryAdd=noOfVariableColumns;
   localregularHourDesc=regularHourDesc;
   noCol=noOfVariableColumns;
   sInitWidths = “”;
   sColAlign = “”;
   sColTypes="";
   sColSort="";
   sResize="";
   
   mygride = new dhtmlXGridObject(‘mygrid_containerE’);    
   mygride.setImagePath("./Grid_js/imgs/");
   mygride.setSkin(“light”);
   
   //mygride.setHeader(columnNames);
   
   for(var icnt=0;icnt<columnNames.length;icnt++)
   {
    columnNames=columnNames.replace(" “,”_");
   }
   
   var cTrial=columnNames.split(",");
   sHeaderAlign=new Array(cTrial);
   for(iT=0;iT<(cTrial.length-1);iT++)
   {
    if(cTrial[iT]==“Employee”)
    {
     if(showEmpId==“N” ||showEmpId==“n” )
     {
      sInitWidths=sInitWidths+“0”+",";
     }
     else
     {
      sInitWidths=sInitWidths+ (cTrial[iT].length)*9 +",";
     }
    }
    else if(cTrial[iT]==“SalaryClass” || cTrial[iT]==“ProcessLevel”)
    {
     sInitWidths=sInitWidths+“0”+",";
     
    }
    else if(cTrial[iT]==“Employee_Name”)
    {
     sInitWidths=sInitWidths+“200”+",";
    }
    else
    {
     sInitWidths=sInitWidths+ (cTrial[iT].length)9 +",";
    }
    //For
    if(cTrial[iT]==“Employee_Name” || cTrial[iT]==“SalaryClass” || cTrial[iT]==“Employee” || cTrial[iT]==“Dept.” || cTrial[iT]==“Status” || cTrial[iT]==“ProcessLevel”)
    {
     sColTypes=sColTypes+“ro”+",";
    }
    else if(cTrial[iT]==“Temp_Dept”)
    {
     sColTypes=sColTypes+“ed”+",";
    }
    else
    {
     sColTypes=sColTypes+“edn”+",";
    }
    
    //For Alignment
    if(cTrial[iT]==“Employee” || cTrial[iT]==“Status” )
    {
     sColAlign=sColAlign+“center”+",";
    }
    else if(cTrial[iT]==“Employee_Name” || cTrial[iT]==“Dept.” || cTrial[iT]==“Temp_Dept”)
    {
     sColAlign=sColAlign+“left”+",";
    }
    else
    {
     sColAlign=sColAlign+“right”+",";
    }
    
    //For Header Alignment
    if(cTrial[iT]==“Employee_Name” || cTrial[iT]==“Dept.” || cTrial[iT]==“Temp_Dept”)
    {
     sHeaderAlign[iT]=“text-align:left”;
    }
    else
    {
     sHeaderAlign[iT]=“text-align:center”;
    }
   }
   sInitWidths=sInitWidths+ (cTrial[iT].length)9;
   sColTypes=sColTypes+“edn”;
   sColAlign=sColAlign+“right”;
   sHeaderAlign[iT]=“text-align:center”;
   mygride.setHeader(columnNames,null,sHeaderAlign);
   for(i=0;i<noOfFixedColumns;i++)
   {
    sColSort=sColSort+“str”+",";
   }
   
   for(i=0;i<noOfVariableColumns;i++)
   {
    
    if(i==noOfVariableColumns-1){
     sResize=sResize+“false”;
     //sInitWidths=sInitWidths+"
";
     //sColAlign=sColAlign+“right”;
     //sColTypes=sColTypes+“ed”;
     sColSort=sColSort+“na”;
    }
    else{
     sResize=sResize+“false”+",";
     //sInitWidths=sInitWidths+"
"+",";
     //sColAlign=sColAlign+“right”+",";
     //sColTypes=sColTypes+“ed”+",";
     sColSort=sColSort+“na”+",";
    }
   }
   
   mygride.setColSorting(sColSort);
     mygride.setColTypes(sColTypes);
   mygride.enableEditTabOnly(1); //to set tab order
   mygride.enableEditEvents(true,true,true);
   mygride.setInitWidths(sInitWidths); 
   mygride.setColAlign(sColAlign);
   mygride.xml.top=“EMPLOYEES”;
      mygride.xml.row="./EMPLOYEE";
   mygride.setColumnIds(columnNames);
  // mygride.enableResizing(sResize);
   mygride.attachEvent(“onRowSelect”,doOnRowSelected);
   mygride.enableKeyboardSupport(true);
   
   //For Float validation
   mygride.attachEvent(“onEditCell”,function(stage,rowId,cInd)
   {
       if(stage==1&& (cInd>=noOfFixedColumns || cInd==noOfFixedColumns))
       {
        mygride.editor.obj.onkeypress = function(e)
           {
               var ev = (e||event)
               var key = (ev.charCode||ev.keyCode)
               if(key == 46)
      return true;
      else if( (key < 48) ||( key > 57 )) 
               return false
           }   
       }
       return true;
   });
  
   //For left and right arrow keys
   mygride.attachEvent(“onKeyPress”,function(e)
   {
        if(e==39)//right arrow key
        {
       mygride._key_events.k9_0_0.call(mygride);
        }
        if(e==37)//left arrow key
        {
         
      mygride._key_events.k9_0_1.call(mygride);
        }
        return true;
   });
    
    //mygride.entBox.onbeforedeactivate=null;
    
  mygride.init();
  
  mygride.entBox.onbeforeactivate=mygride.entBox.onbeforedeactivate=null;
  for(p=1; p<=mygride.getColumnsNum();p++)
  {
    
    if(mygride.getColumnLabel§==“Week End”||mygride.getColumnLabel§==“Temp Dept” || mygride.getColumnLabel§==“ClientJobId”)
    {
     continue;
    }
    mygride.setNumberFormat(“0000.00”,p);
  }
   
 // mygride.enableAutoWidth(true);
  if(flag!=‘init’)
  {
    csvData=document.frmWebTimeEntry.csvTextArea.value;
    mygride.clearAll();
    mygride.loadCSVString(csvData);
  }
  }
  



//For loading grid
  function loadGrid(sClientId,flag)
  {
   mygride.clearAll();
   dedgrid.clearAll();
   if(flag==‘init’)
   {
    var fileName=sClientId+"_HoursAndEarnings.xml";
    mygride.load(fileName,sort,“xmlB”);
    
    function sort()
    {
     mygride.forEachRow(function(id)
     {
         mygride.sortRows(0,“str”,“asc”);
     });
    }
   }
    mygride.setSortImgState(true,1);
    
    var dedfileName=sClientId+"_Deductions.xml";
    
    dedgrid.load(dedfileName,“xmlB”);
    function sortDed()
    {
     dedgrid.forEachRow(function(id)
     {
         dedgrid.sortRows(0,“str”,“asc”);
         dedgrid.setCellExcellType(id,4,“combo”);
     });
    }
    
    document.getElementById(“cmdClrShHrs”).disabled=false;
    document.getElementById(“cmdSaveTimeEntries”).disabled=false;
    document.getElementById(“cmdNext”).disabled=false;
    comboGroup.disable(false);
  }
  



//For groupBy Functionality



function setGroupBy()
 {
  
  var mygridGroup = “”;
   if(document.frmWebTimeEntry.hdnActiveTab.value == “Payroll”)
   {
    mygridGroup = mygride;
   } 
   if(document.frmWebTimeEntry.hdnActiveTab.value == “Deductions”)
   {
    mygridGroup = dedgrid;
   }
  
  var groupByValue=comboGroup.getSelectedValue();
  
  var pGroupCheck=1;
  var vElse=0;
  
   for(pGroupCheck=0; pGroupCheck<=mygridGroup.getColumnsNum();pGroupCheck++)
  {
   if(mygridGroup.getColumnId(pGroupCheck)==groupByValue)
   {
    break;
   }
   else if(groupByValue==“None”)
   {
    vElse=1;
    break;
   }
  }
  
  mygridGroup.setCSVDelimiter(",");    //change csv delimiter
   var csvNew = mygridGroup.serializeToCSV();
     mygridGroup.clearAll();
  mygridGroup.loadCSVString(csvNew);
  if(vElse==1)
  {
   mygridGroup.unGroup();
  }
  else
  {
   mygridGroup.groupBy(pGroupCheck);
  }
  
  
 }



Code in the bold letters I’ve written because without using it, groupBy was working only for the first time and from the second time grid was not getting loaded, it was giving the follwong javascript error:



 ‘this.rowsCol[…].childNodes’ is null or not an object.



Please tell me where I’m going wrong.



Thanks in Advance,



Namrta



 



 

What version of dhtmlxGrid do you use? Groping+filtering work well since 2.0 version. Please contact support@dhtmlx.com and provide you red. ID and we’ll send you sample.