Pdfmake: How to fill column background color for pdfmake with fillColor ?

[athimannil]

Is there any option to fill column background color with fillColor: '#dedede' ?
fillColor works in tablecell very well at the same time it doesn't work for column :(

<script src="https://rawgit.com/bpampuch/pdfmake/master/build/vfs_fonts.js"></script>
<script src="https://rawgit.com/yelouafi/pdfmake/master/build/pdfmake.js"></script>
<script>
  function print(argument) {
    // open the PDF in a new window
    pdfMake.createPdf(docDefinition).open();
  }
</script>
<button onclick="print()" style="display:block; margin: 10px auto;padding: 20px 50px;">Print</button>
<hr>
<script>
  var docDefinition = {
    content: [
      'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', {
        columns: [{
          // auto-sized columns have their widths based on their content
          width: 'auto',
          text: 'First column',
          fontSize: 30,
          fillColor: '#dedede'
        }, {
          // star-sized columns fill the remaining space
          // if there's more than one star-column, available width is divided equally
          width: '*',
          text: 'Second column'
        }, {
          // fixed width
          width: 100,
          text: 'Third column'
        }, {
          // percentage width
          width: '10%',
          text: 'Last column'
        }],
        // optional space between columns
        columnGap: 10
      },
      'This paragraph goes below all columns and has full width'
    ]
  };
</script>

[jthoenes]

If background color on columns doesn't work for you, I guess it doesn't work at all :-/

Do you want to work on a pull request for that?

[athimannil]

@jthoenes Thank you very much for your quick reply.
I will have a look how does the function works, and I will definitely implement give pull request if I find solution :+1:

[credli]

You can use a table for that. Here is what worked for me:

content: [
{
table: {
widths:['*'],
body: [[{ text: "Monthly Report", style: 'filledHeader' }]]
}
}
],
styles: {
filledHeader: {
bold: true,
fontSize: 14,
color: 'white',
fillColor: 'black',
alignment: 'center'
}
}

[mohamedabbas1992]

background:red

[vkosnett]

sorry but none of these suggestions work

[TehEbil]

Table approach worked (background is just background for text, maybe if one uses it in a columns parent):

{
    margin: [32, 0, 0, 0],
    table: {
        widths: ['*'],
        body: [[{
            fontSize: 10,
            fillColor: 'lightgrey',
            alignment: 'left',
            columns: [
                {
                   text: 'foo 123'
                },
                {
                   text: '456 bar'
                }
           ]
       }]]
   }
}

or you can also replace columns with just a {text: 'hi'}

[RactivussDevs]

{
table: {
widths: [ '', '', ],
body: [
[ 'Column1', 'Column2', ],
],
},
layout: {
fillColor: function(rowIndex, node, columnIndex) {
return (rowIndex === 0) ? '#0050b8' : null;
},
},
}

This is what you were looking for!! this worked for me, now I'm trying to figure out how change the 'text color' of the row