Styling pdfHtml5 messageTop for a function return variable.
Styling pdfHtml5 messageTop for a function return variable.
bchipre
Posts: 30Questions: 10Answers: 0
Hello @allan @kthorngren
I have tried to style my pdfHtml5 messageTop which is using a function return. Tried all the option without any success. Below is the code I tried :
messageTop: {
text: 'ESM | List of <?php echo $emp_name; ?>' + '\n' + $("div.toolbar").text(),
fontSize: 10,
fontFamily: 'Poppins sans-serif',
bold: true,
italics: false,
alignment: 'center'
}
and
messageTop: function(){
return 'ESM | List of <?php echo $emp_name; ?>' + '\n'+ $("div.toolbar").text();
},
customize: function(doc) {
doc.styles.messageTop = {
color: 'red',
fontSize: '10',
fontFamily: 'Poppins sans-serif',
background: 'blue',
alignment: 'center'
}
and also tried to use a plan CSS
#example .datatables .messageTop {
font-size: 10px;
text-align: center;
font-family: 'Poppins sans-serif';
}
Is there any way this can be achieved. Want to make the messageTop loo like
This question has an accepted answers - jump to answer
Answers
This example here may help, it shows the different combination. Also this thread which discusses alignment,
Colin
@colin
Tried with the thread, but no success. Still jumbling to style the Title and messageTop.
Here is the test case : http://live.datatables.net/rabuhode/1/edit
I'm sorry, my first link was omitted above - it should have been this example.
This SO thread talks about changing fonts. I suspect you'll need to dig into the PDFMake docs more to get to the bottom of it,
Colin
@colin Nothing worked out. No info in PDFMake Docs too. Still struggling !
This is how we add the message top to the PDF:
So unfortunately you can't style it directly using
messageTop.Two options:
messageTopis an object (which could include styling information). If so then put that on thedoc.contentarray, orcustomizecallback to modify the styling as needed.Allan
@allan @colin
Fixed this alignment and styling for messageTop as suggested by @allan.
Here is the updated example : http://live.datatables.net/gubugaja/1/edit