I'm sure it's simple, but I'm not figuring it out.
I have a column that I'm formatting as currency. However, all of the text is Left justified in that column. It would be a lot easier to read if all the values lined up and where right justified.
What do I do if I want to right justify a column... or center since we're on the topic.
Sure! :)
All you need to do is hook up to the headerCellRendered event of the igGrid and in the handler consider the ui.columnKey param.Thus you can apply the text justification only to the desired columns.Here's a code sample of how to accomplish this:(I'm attaching a working HTML page that illustrates the sample code)
$("#Grid1").igGrid({ autoGenerateColumns: false, dataSource: sourceData, primaryKey: "ProjectID", columns: [ { key: "ProjectID", headerText: "Project Id", width: 100, dataType: "number" }, { key: "Name", headerText: "Name", width: 200, dataType: "string" }, { key: "StartDate", headerText: "Start Date", width: 150, dataType: "date" }, { key: "EndDate", headerText: "End Date", width: 150, dataType: "date" }, { key: "IsPostponed", headerText: "Is Postponed", width: 100, dataType: "bool" } ], headerCellRendered: function(evt, ui) { if(ui.columnKey === "Name" || ui.columnKey === "StartDate") { $(ui.th).css("text-align", "center"); } } });
Cheers!Borislav
This script works great, but is there a way to specify the alignment of INDIVIDUAL columns. I see that you can use css to specify the alignment of all columns. Thanks in advance for any advice.
Hi guys,I'm afraid that the only reasonable solutions to this are the ones that Angel has provided in his posts.Due to reasons I'm afraid that we haven't had the opportunity to provide an easy-to-use out-of-the-box solution (although cell templates will work perfectly in such a situation).If you wish to submit this as an official feature request, you can now do so from this form: https://es.infragistics.com/my-account/feature-request
Was there ever an update to this? I saw the suggestions in the samples to jump through some hoops via jquery to specify alignment or to change the class for the headers but I need to center some headers and left align others. I also need to right align some currency numbers. It'd be a heck of a lot easier with some values/attributes on the columns.
Hi Tony,
This is regarding column data justification, instead of using css styles to align data, is there any attribute you can specify as column options? as we generate columns and it will be easy if there is just an option to column definitions.
Please let me know.
Thanks