Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
Hi Everyone,
We have a requirement to create Nprinting reports in HTML format.
We are pulling reports from Qliksense Application. We have created report in Table chart in Qliksense.
When trying to apply any HTML format on table like background colour, it is not having any change or impact.
Can anyone help me to resolve this issue?
Requirement: I want to apply background color to headers of table.
Below is the header of a table:
Region Name |
Inspection Planned (Allocated) |
Allocated % |
Inspection Commenced |
Commenced % |
Inspection Completed |
Completed % |
Inspection Pending based on completion date |
Pending % |
Inspection pending based on finalization date |
Finalized Date % |
Hi, Please specify which version of NPrinting you are actually using - it is not clear from the Labels you have chosen when creating this post and creates confusion as version you have chosen have very different capabilities.
To add to the other post above - you need to make sure you disable "Keep source format" in Properties on this table (in NPrinting Designer) for any formatting implemented in HTML to work: https://help.qlik.com/en-US/nprinting/May2022/Content/NPrinting/ReportsDevelopment/Designer-properti...
thanks
Lech
Hello @_rohitgharat ,
If you use the table tag to generate the html code of table you could only use css to edit it:
table tbody tr:first-child {
background: red;
}
I suggest you to insert the table into a div with id to limite the style at only that table, then you should edit the selector like this: "#divid table tbody tr:first-child"
Otherwise, you could create table using single column tag, NPrinting editor create the html code of the table and than you could personalize it.
There are two option, if you choose "show header = show" you should use same solution as before, but if you choose "show header = hide" you could insert the header manually as you prefer.
Below an example of code
First table is generated by NPrinting using table tag.
The second table is the same object of the first but use the column tag.
The third one use the column tag but in NP table object I setted "show header = hide".
<html>
<head>
<style>
#example table tbody tr:first-child {
background: red;
}
#red-bg tr:first-child {
background: red;
}
.header-red {
background: red;
}
</style>
</head>
<body>
<div id="example">
%%LFJpkPn%%
</div>
<div>
<p></p>
<p>line break</p>
<p></p>
</div>
<table cellspacing=0 style="border-collapse:collapse;" id="red-bg">
<tr>
<td>%%Cod%%</td>
<td>%%Sum(Value)%%</td>
</tr>
</table>
<div>
<p></p>
<p>line break</p>
<p></p>
</div>
<table cellspacing=0 style="border-collapse:collapse;">
<tr class="header-red">
<td>Cod</td>
<td>Value</td>
</tr>
<tr>
<td>%%Cod_1%%</td>
<td>%%Sum(Value)_1%%</td>
</tr>
</table>
</body>
</html>
Regards
Hi, Please specify which version of NPrinting you are actually using - it is not clear from the Labels you have chosen when creating this post and creates confusion as version you have chosen have very different capabilities.
To add to the other post above - you need to make sure you disable "Keep source format" in Properties on this table (in NPrinting Designer) for any formatting implemented in HTML to work: https://help.qlik.com/en-US/nprinting/May2022/Content/NPrinting/ReportsDevelopment/Designer-properti...
thanks
Lech
Hi @Lech_Miszkiewicz @andregas ,
Below is the sample code i have written:
so i want to apply background color for the headers of these table.
Can you please tell me the correct code which i need to apply?
Regards,
Rohit Gharat
Well, you have not done this right. Have you studied the basic tutorial from help site to get understanding how things work in NPrinting HTML template? If not - you need to do this as everything is described there
When you build a template using the method described you will be able to choose whether you want to show headers or not and you will get <tr><td> and <table> tags which will allow you to apply css on it.
You can also choose to hide headers and write your own <th> html tags with the headers individually and apply formatting manually on it or if it needs to be dynamic then you can use variables or formulas to populate it too
cheers