EasyUI Forum
May 16, 2024, 07:58:27 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Datagrid Font Size  (Read 25237 times)
getk
Newbie
*
Posts: 23


View Profile
« on: August 07, 2013, 05:13:58 AM »

Friends,
thanks for the support you provided so-far.
I'm not able to change font size globally for the datagrid. (May be a silly issue from my side)

Below is how I defined the datagrid. I'm using jquery-easyui-1.3.3 package.
Currently I'm trying to change font-size within rowStyler and its not working !!  "background-color" is working though correctly !

Code:
			$('#dg').datagrid({  
url:myurl,
pageSize: 20,
pagination: true,
rownumbers: true,
singleSelect: true,    // So Users can select one alert at a time
remoteSort: false,
title: mytitle,
rowStyler:function(index,row){     // ROW Colouring  
if (row.severity == '0'){    
return 'background-color:#58FA82;font-size:10px;';  
}
else if (row.severity == '1'){      
return 'background-color:#C5F0FE;font-size:10px;';  
}
else if (row.severity == '4'){      
return 'background-color:#FBB870;font-size:10px;';  
}
else if (row.severity == '5'){      
return 'background-color:#FF7684;font-size:10px;';  
}
},  
columns:[[  
{field:'alertid',title:'AlertID',width:50, sortable:true},  
{field:'start_date',title:'start_time',width:100, sortable:true},
{field:'alert_type',title:'Type',width:50, sortable:true},  
{field:'exception_type',title:'Exception',width:50, sortable:true},  
{field:'customer',title:'customer',width:80, sortable:true},  
{field:'timereceived',title:'timereceived',width:100, sortable:true},  
{field:'note',title:'Remedy',width:80, sortable:true},  
{field:'site_ID',title:'Site ID',width:40, sortable:true}  
]]  
});

I even tried while initiating the datagrid, but still its NOT working  Undecided
Code:
	<table id="dg" toolbar="#toolbar" style="height:620px; font-size:10px;" ></table>

Where should i make amendments so as to change the font-size for the whole of datagrid?
« Last Edit: August 07, 2013, 07:12:26 AM by getk » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: August 08, 2013, 12:47:55 AM »

To change font size for all cells, override the 'datagrid-cell' style:
Code:
<style>
  .datagrid-cell{
    font-size:10px;
  }
</style>

To change font size for a column, use the 'formatter' function:
Code:
function formatField(value){
return '<span style="font-size:10px">'+value+'</span>';
}
$('#dg').datagrid({
  columns:[[
    {field:'name',title:'Name',width:100,formatter:formatField}
  ]]
});
Logged
getk
Newbie
*
Posts: 23


View Profile
« Reply #2 on: August 09, 2013, 04:30:17 AM »

Hi Stworthy,
You are a STAR !! thanks a lot mate

Is there anyway, I can auto-adjust the cell height according to the font-size? ( I believe autoRowHeight is defaulted to true, but still the height remains the same for font-size 12px)
« Last Edit: August 09, 2013, 04:42:11 AM by getk » Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!