text align for DataTables 1.10.10

ashiers

It used to be that when we wanted to change the alignment of all the text in a column we would use syntax like this:

$('#example').dataTable( {
            dom: "Bfrtip",
            ajax: "../jsp/browsers.jsp",
            columns: [
                { data: "browser" },
                { data: "engine" },
                { data: "platform" },
                { data: "version", "sClass": "center" },
                { data: "grade", "sClass": "center" }
            ]
                        ...

For columns "version" and "grade" this certainly still works, but is apparently deprecated. Even though DataTables is backward compatible, I'd like to know how this is supposed to be written for the new version of DataTables?

Alan

dclar43

I'm not sure if that was a feature or a happy accident on your end. But whether it was or wasn't, it comes down to CSS styling. Another way to achieve this would be the following:

$('#example').dataTable( {
            dom: "Bfrtip",
            ajax: "../jsp/browsers.jsp",
            columns: [
                { data: "browser" },
                { data: "engine" },
                { data: "platform" },
                { data: "version", className: "uniqueClassName" },
                { data: "grade", className: "uniqueClassName" }
            ]

Then wherever you find applicable add the following CSS:

.uniqueClassName {
    text-align: center;
}

It's possible that a file used to have a CSS rule for the class center and styled it for you already.

allan

Yes - columns.className is the way to assign a class to a column. Then use a little CSS to specify what you need in terms of alignment.

The default DataTables stylesheet offers some default classes that can be used for alignment.

Allan

ashiers

Thanks for the advise fellas. I understand now what's going on with this. I've got it working properly now.