http://jsfiddle.net/rxb3xmjt/11/
In the above example,Currently values of Quantity is aligned to left in example
How can all the values of Quantity in iggrid be aligned to right?.
Hello Akhi,
Thank you for posting in our community.
Changing text alignment of igGrid`s headers or cells can be accomplished by setting the text-align property in the css classes applied to these elements. For example:
th.ui-iggrid-header:nth-child(3){ text-align: right !important; } .ui-iggrid .ui-iggrid-tablebody td:nth-child(3) { text-align: right !important; }
Your modified fiddle is available here. I changed the css classes applied to the Quantity column in order to set the text-align option to right.
Please let me know if you need any further assistance with this matter.
Hi Vasya,
Thank you for the reply.I believe you are hard coding 3rd column.
How can i dynamically right align columns with "Quantity" in example to right align.
Please provide a working copy
Can we do this in columns: attribute of iggrid?..where all "Quantity" columns can be right aligned?
In order to select only the "Quantity" column the css selector can be modified. Each th has an id containing the column key. If the selector is modified in order to match only values that has an id ending with "Quantity" the new style is going to be applied only to these columns. For example:
th.ui-iggrid-header[id$=Quantity]{ text-align: right !important;}
Your modified fiddle is available here.
Additionally, igGrid has two options that can be used foe applying styles to cells and headers:
// Initialize
$(
".selector"
).igGrid({
autoGenerateColumns:
false
,
columns: [
{ headerText:
"Product Name"
, key:
"Name"
, dataType:
"string"
, headerCssClass:
"headerCss", columnCssClass: "colCss"
}
]
});
Thank you Vasya!!.Appreciate your help
I am glad that you find my suggestion helpful.
Thank you for using Infragistics components.