Start Building Professional
Web Apps Today

TreeGrid dhtmlXGridObject

Hi there
Q1. Is it possible to collapse all opened nodes on click on plus (+) gif image, basically I do not want to show more than one expanded node, mygrid.collapseAll() is not triggered on click of plus( +) gif image

Q2. Is it possible to sort only one specific child node that is expanded not root nodes and other child nodes?

Q3. How can I sort if I have a column with dollar amounts say $38,277.76 and my amount is dynamic if I open my application in US it have $ sign, if I open in UK it has pound sign. setNumberFormat did not work even for dollar amount.

mygrid.setNumberFormat("$0,000.00",3);

Q4. How can I hide a checkbox in a cell In XML? I tried below but did not work, could not find option like disabling checkbox.

<cell nocheckbox="1">1</cell>



Please find my below sample code

        mygrid = new dhtmlXGridObject('gridbox');
        mygrid.imgURL = "<%=request.getContextPath()%>/secure/images/";
        mygrid.selMultiRows = true;
        mygrid.attachEvent("onRowSelect",doOnRowSelected);
        mygrid.enableCellIds(true);
        mygrid.setHeader("<span class=''><bean:message key='vehicleDailyStatement.asOfPriorEOD'/> </span>, , ,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.principal'/><br><html:label key='vehicleDailyStatement.balance'/></span>,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.units'/></span>,<span class='reportHeadLeft'><html:label key='vehicleDailyStatement.description'/></span>,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.interest'/></span>,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.flats'/></span>,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.insurance'/></span>,<span class='reportHeadRight'><html:label key='vehicleDailyStatement.fees'/><span>,<span class='reportHeadCenter'><html:label key='vehicleDailyStatement.floor'/><br><html:label key='vehicleDailyStatement.floordate'/></span> ,<span class='reportHeadCenter'><html:label key='vehicleDailyStatement.maturity'/><br><html:label key='vehicleDailyStatement.maturitydate'/></span>,<span class='reportHeadCenter'><html:label key='vehicleDailyStatement.duplicate'/><br><html:label key='vehicleDailyStatement.COV'/></span>,<span class='reportHeadCenter'><html:label key='vehicleDailyStatement.subvened'/></span>,<span class='reportHeadCenter'><html:label key='vehicleDailyStatement.stock'/><br><html:label key='vehicleDailyStatement.number'/></span>");
        mygrid.setInitWidthsP("21,1,1,8,4,12,8,8,7,7,7,6,3,3,6");
        mygrid.setColAlign("left,left,left,left,left,left,left,left,left,left,left,left,left,left,left");
        mygrid.setColTypes("tree,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ch,ch,ro");
        mygrid.setColSorting("na,str,str,int,int,str,str,str,str,str,date,date,na,na,str");
        mygrid.setNumberFormat("$0,000.00",3);
        mygrid.init();
        mygrid.loadXMLString(getvehicleDailyStatementInqDOM());    

>>Q1. Is it possible to collapse all opened nodes on click on plus (+) gif image
mygrid.attachEvent("onOpenStart",function(node,mode){
     if (mode == -1 ) //open
           mygrid.collapseAll(); 
     true;

});

>>Q2. Is it possible to sort only one specific child 
It not possible to achieve such use-case through API 
Can be done by code modification, you can adjust line 263 in dhtmlxtreegrid.js 
               this._sortTreeRows(funct,0);
The second parameter is a row ID from which sorting will start. It may be replaced by some global var

>>Q3. setNumberFormat did not work even for dollar amount
change type of related column to "ron"

>>Q4. How can I hide a checkbox in a cell In XML? 
You can change type of cell
<cell type="ro"></cell>

Thanks a lot for quick response 1,2 an 4 worked like a Charm, still not able to sort amount and date fields,

when i am trying to sort on date field got number expected javascript error message on _sortTreeRows function i am using mm/dd/yyyy format and please find below my sample xml code used to build this field, Note: i am using here span tag for sytle, please find attached screenshot 1.

 
rowElement1.addElement("cell").setText("<span class='rVR'>"+unitItem.getFloorDate()+"</span>");

 

>>Q3. setNumberFormat did not work even for dollar amount
change type of related column to "ron"

when i used ron to sort my amount field with dollar symbol its not sorting correctly please find attahed screenshots 2 and 3 and in some cases got NaN error message

Thanks
Laks

>>when i used ron to sort my amount field with dollar symbol its not sorting correctly 
The next need to be done
a) values in XML provided as raw numbers
        <cell>123456.78</cell>
b) setNumberFormat for column in question set
          mygrid.setNumberFormat("$0,000.00",3);
c) ron column type and int sorting type used for the column

As result grid will render data as formatted value with "$" prefix, but will have raw int value for sorting. 

Also, please be sure that each row has unique ID, non-unique IDs can result in incorrect sorting. 

>>rowElement1.addElement("cell").setText("<span class='rVR'>"+unitItem.getFloorDate()+"</span>");
Problem is it in surrouinding tag, the grid will not be able to convert cell value correctly because of it.
The only solution in such case is custom sorting routine. 
http://dhtmlx.com/docs/products/dhtmlxGrid/doc/articles/Sorting_in_grid.html#grid_art_sort

Something similar to next

function str_custom(a,b,order){  
 a = a.replace(/<[^>]*>/gi,"")
 b = b.replace(/<[^>]*>/gi,"")
  if (order=="asc")
  return (a>b?1:-1);
  else
  return (a>b?-1:1);
}

As suggested I provided raw number but did not work; look like I did not give my requirement in detail in my previous email, our application is an international financial application which is used with various Monitory (dollar, Euro, Yen and pound currency).As shown in my previous email screenshots, Note. I am building XML DOM and passing to grid. Our application uses standard style so I am surrounding with span tag as follows for principal balance field, and my balance field would range from 0.00 to 000000000.00

 

rowElement.addElement("cell").setText("<span class='sectionTotal'>"+vehicleDailyStmtDetail.getPrincipalBalAmt()+"</snap>");

 

 

 

Q 1 I would like to sort my principal  and same time dispaly nice formated string (for e.g $1,234.56 )for all my currency fields, so would like to know how I should be defining, if I give ron as colSorting then cannot use custom sort function to remove span tag in cell.,   My sample screenshot is attached

 

 

<cell>123456.78</cell> //values in XML provided as raw numbers

Var  curSymbol = <%=formatter.getCurrency().getSymbol();%>;   // I got my generic Currency Sysmbol - This may be dollar symbol or Euro or pound

Var chGroupSep = <%= formatter.getGroupingSeparator());%>;// I got my generic group separator - This may be comma or for pound empty no separator

Var decSep = <%= formatter. getDecimalSeparator ());%>;// I got my generic decimal separator - This may be dot or comma

 

I would like to do all this for 3 index say for principal balance.

 

My code

 

mygrid.setColTypes("tree,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ch,ch,ro,ro");

mygrid.setColSorting("na,na,na,ron,int,str,str_custom,str_custom,ron,ron,date,date,na,na,int,int");

mygrid.setNumberFormat("$0,000.00",3,".",",");

 

function str_custom(a,b,order){ 

 a = a.replace(/<[^>]*>/gi,"")

 b = b.replace(/<[^>]*>/gi,"")

  if (order=="asc")

  return (a>b?1:-1);

  else

  return (a>b?-1:1);

}

 

Thanks

Laks

>>so would like to know how I should be defining
You can use preformated data and custom sorting, or use raw data and setNumberFormat ( which value may be set according to used currency|format )
Working sample sent by email.