PDA

View Full Version : GridPanel - column text truncated



epi82
16 Sep 2010, 3:05 AM
Hello,

in my GridPanel when a column text is too long is truncated with "..."

How can I prevent it? I need something like this:

22433

Is it possible?

Thank you.

laurentParis
16 Sep 2010, 3:39 AM
you can use css "white-space: normal;" on cells

epi82
16 Sep 2010, 6:36 AM
I've tried with this renderer function and it works good!


function arg(val){
return '<div style="white-space:normal;">' + val + '</div>';
}

Thank you!

laurentParis
16 Sep 2010, 6:43 AM
it will be more efficient to use this code if arg method is your renderer method


function arg(val, meta){
meta.css += ' white-space-normal';
return Ext.util.Format.htmlDecode(val);
}
...
into your css file add this line :
.white-space-normal {white-space:normal;}

epi82
16 Sep 2010, 6:54 AM
I've tried this:


function arg(val, meta){
meta.style = 'white-space:normal;';
return Ext.util.Format.htmlDecode(val);
}

but it doesn't give me the same result... what's wrong?

laurentParis
16 Sep 2010, 6:56 AM
I'm not sure that style is supported by meta argument
try with css, it's better than using style

epi82
16 Sep 2010, 7:23 AM
it will be more efficient to use this code if arg method is your renderer method


function arg(val, meta){
meta.css += ' white-space-normal';
return Ext.util.Format.htmlDecode(val);
}
...
into your css file add this line :
.white-space-normal {white-space:normal;}



Now it works... but I modified ext-all.css:


.x-grid3-cell-inner, .x-grid3-hd-inner{
overflow:hidden;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
padding:3px 3px 3px 5px;
/*white-space: nowrap; with this setting the function doesn't work*/
}

Is it possible or I'm wrong?

laurentParis
16 Sep 2010, 7:26 AM
you can create your own css file or add in your html file into head tag


<style type="text/css">
.white-space-normal {white-space:normal;}
</style>


Ps: don't modify ext-allxxxx.js or ext-all.css... never !