Print Page - Slow rendering of treegrid

Hello
I have a problem with rendering treegrid table that contains about 500 lines. Data is retrieved using JSON in 411ms and then takes 1 minute rendering the table. These times apply to firefox. In Internet Explorer, it's even longer.

Here is the html table code

Code:

<table id="tt" title="{title_table}" class="easyui-treegrid" style="width:auto;height:610px" url="json.php?pob={pobocka}"  
        rownumbers="false" showFooter="false" autoRowHeight="false"
        idField="id" treeField="name">
		<thead>
			<tr>
				<th colspan="7">Součet za:</th>
				<th colspan="7">Zákazník</th>
				<th colspan="6">Pobočka</th>
				<th colspan="6">Firma</th>
			</tr>
			<tr>
				<th colspan="7">Popis/Rok</th>
				<th colspan="2">2011</th>
				<th colspan="2">2012</th>
				<th colspan="3">2013</th>
				<th colspan="2">2011</th>
				<th colspan="2">2012</th>
				<th colspan="2">2013</th>
				<th colspan="2">2011</th>
				<th colspan="2">2012</th>
				<th colspan="2">2013</th>
			</tr>
			<tr>							
				<th field="name" width="300px">Název</th>			
				<th field="match">Match</th>
				<th field="norm" align="right">NORM</th>
				<th field="TOP" align="right">TOP</th>
				<th field="BUS" align="right">BUS</th>
				<th field="VIP" align="right">VIP</th>								
				<th field="PER" align="right">PER</th>
				<th field="M2011" align="right" styler="zakaznik">ks</th>
				<th field="P2011" align="right" styler="zakaznik" formatter="cislo">Prodej</th>
				<th field="M2012" align="right" styler="zakaznik">ks</th>
				<th field="P2012" align="right" styler="zakaznik" formatter="cislo">Prodej</th>
				<th field="M2013" align="right" styler="zakaznik">ks</th>
				<th field="P2013" align="right" styler="zakaznik" formatter="cislo">Prodej</th>
				<th field="PL2013" align="right" styler="plan" formatter="cislo">Plán</th>
				<th field="MM2011" align="right" styler="pobocka">ks</th>
				<th field="PP2011" align="right" styler="pobocka" formatter="cislo">Prodej</th>
				<th field="MM2012" align="right" styler="pobocka">ks</th>
				<th field="PP2012" align="right" styler="pobocka" formatter="cislo">Prodej</th>
				<th field="MM2013" align="right" styler="pobocka">ks</th>
				<th field="PP2013" align="right" styler="pobocka" formatter="cislo">Prodej</th>
				<th field="MF2011" align="right" styler="firma">ks</th>
				<th field="F2011" align="right" styler="firma" formatter="cislo">Prodej</th>
				<th field="MF2012" align="right" styler="firma">ks</th>
				<th field="F2012" align="right" styler="firma" formatter="cislo">Prodej</th>
				<th field="MF2013" align="right" styler="firma">ks</th>
				<th field="F2013" align="right" styler="firma" formatter="cislo">Prodej</th>
			</tr>
		</thead>    
</table>

Here is the javascript code

Code:

easyloader.locale='cs';
function cislo(value,row,index)
{
	if(typeof value !='undefined')	return number_format(parseFloat(value.replace(",",".")),0,',',' ');
	else return "";
}
function zakaznik(value,row,index){  
    return 'background-color:#ffffbb';  
}  	
function plan(value,row,index){ 
	if(typeof value !='undefined')
	{
		if(parseFloat(value.replace(",",".")) > parseFloat(row.P2013.replace(",",".")))
    		return 'background-color:#ffffbb;color:red;';
    	else  
    		return 'background-color:#ffffbb;color:green;';
    }
   	else  
   		return 'background-color:#ffffbb;color:green;';
}  
function pobocka(value,row,index){  
return 'background-color:#ccffcc';  
}  	
function firma(value,row,index){  
return 'background-color:#ffeebb';  
}

If I don't use formatting of column and numbers it does not have significant impact to rendering time.

Thanks a lot.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: msvabik on March 28, 2013, 02:11:13 AM