Different align properties for cell and column footers

Posted by: david.hettmer on 17 June 2020, 9:18 am EST

    • Post Options:
    • Link

    Posted 17 June 2020, 9:18 am EST

    Is there a way to make alignment properties of a flexgrid column to be different to its columnFooters? For example, the column needs to be center-aligned but its footer needs to be left-aligned. What I’ve done so far is, first, set the align property of the column to center, then, grid.columnFooters.columns[0].align = ‘left’. However, it also changes the align property of the column to ‘left’. Thanks in advance.

  • Posted 18 June 2020, 2:41 am EST

    Hi David,

    The columns for footer and header are the same. That is why setting the alignment for the footer column changes the align of the header and cells too. If you need to left align all the footer rows, then simply use the following CSS:

    .wj-flexgrid .wj-colfooters .wj-cell {
    	text-align: left !important;
    }
    

    But, if you need some footers to be left and others to be right and so on, then you will need to set the cssClassAll property of the column and use the following CSS:

    grid.columns[0].cssClassAll = 'align-left';
    
    .wj-flexgrid .wj-colfooters .wj-cell.align-left {
    	text-align: left !important;
    }
    

    Regards

  • Posted 2 January 2025, 9:36 am EST - Updated 2 January 2025, 9:42 am EST

    Hi Ashwin

    The contents of first cell of column footer needs to be aligned. I tried the above solution but it didn’t work.

    Any idea on why it’s not working.

  • Posted 2 January 2025, 9:58 am EST

    Hi Ashwin

    I just got the solution by applying below style

    .wj-bottomleft .wj-row .wj-cell.wj-header {

    text-align: center;

    }

    Thanks

  • Posted 3 January 2025, 12:49 am EST

    Hi Rakesh,

    Thank you for sharing your solution with us! Your contribution will assist others facing similar challenges. I’m also delighted to hear that the issue has been successfully resolved.

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels