cellsalign='right' not working

[yongchen45@gmail.comParticipant]

I have a plain grid with columns in string, integer, datetime and float.
The align=’center’ works out on the column headers, but the cellsalign is not working.
It always aligns to the left.

gridColumns: any[] = [
{ text: ‘Meter Id’, datafield: ‘Id’, width: 50, align: ‘center’, cellsalign: ‘center’ },
{ text: ‘Meter’, datafield: ‘Meter’, width: 200, align: ‘center’, cellsalign: ‘left’ },
{ text: ‘Period’, datafield: ‘FlowPeriod’, cellsformat: ‘MMM yyyy’, width: 75, align: ‘center’, cellsalign: ‘center’ },
{ text: ‘Volume’, datafield: ‘GasVolume’, cellsformat: ‘F4’, width: 75, align: ‘center’, cellsalign: ‘right’ },
{ text: ‘Vol Unit’, datafield: ‘GasVolumeUom’, width: 50, align: ‘center’, cellsalign: ‘center’ }
];

I have tried to use cellsrenderer, but that doesn’t work together with cellsformat attribute.
Am I missing any setting that causes the default simple attribute cellsalign not working?

thanks

[yongchen45@gmail.comParticipant]

additional input, the style rendered has this line:
<div class=”jqx-grid-cell-right-align” style=”margin-top: 6px;”>1.0000</div>

But I cannot find which jqx css file contains class jqx-grid-cell-right-align
Is it possible I miss a css file?

thanks

[yongchen45@gmail.comParticipant]

I have not seen any response from jqxwidgets support staff for two days.
Can someone help?

[HristoParticipant]

Hello yongchen45@gmail.com,

When using cellsrenderer it overrides whole content of the cell including the HTML tag container.
For this reason, it should be set with wanted style.
Please, take a look at this tutorial:
http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-cellsrendering.htm?search=grid

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[yongchen45@gmail.comParticipant]

Hi Hristo,

I didn’t use the cellsrenderer to override.
I am using the built-in cellsalign attribute and it is not doing the function it suppose to do.
I inspected what jqxwidgets code has rendred in chrome developer console, and it is showing this:

<div class=”jqx-grid-cell-right-align” style=”margin-top: 6px;”>1.0000</div>

The cell is still left aligned.
And I cannot find the definition of “jqx-grid-cell-right-align” in code from jqxwidgets’ distribution.

Which css sheet from jqxwidgets’ distribution contains the definition of “jqx-grid-right-align” class?

[Peter StoevKeymaster]

Hi yongchen45,

If you cannot find it then you most probably missed to update All javascript and CSS files in your app and you updated only the scripts. cellsaling=right works correctly and you can view it online in our data grid examples: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/defaultfunctionality.htm?light. Hope this information helps you to resolve your issue.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[yongchen45@gmail.comParticipant]

Thanks Peter, indeed we missed updating the jax.all.css file when upgrading the jqx distribution.

[Author]

Posts