Welcome Guest Search | Active Topics | Sign In | Register

Essential Objects Product Support Forum » All Products » Support » HTML Javascript code is not executing in Pdf Header & Footer

HTML Javascript code is not executing in Pdf Header & Footer Options
Previous Topic · Next Topic
Prasanna
Posted: Monday, April 11, 2022 9:32:13 AM
Rank: Newbie
Groups: Member

Joined: 8/6/2018
Posts: 7
Hi,

I have a HTML page which contains javascript code and styles to generate a Header & Footer.
When i try to pass the HTML string to the following properties "HeaderHtmlFormat" & "FooterHtmlFormat", I can see only raw design in generated pdf without applying any styles and javascript functionality.

Can you please let me know how to handle the javascript implementation and the styles in Pdf header & footer?
Back to top
 
eo_support
Posted: Monday, April 11, 2022 4:56:53 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hi,

You must use inline JavaScript/styles for header/footer. This is because the header and footer are NOT inside the same HTML document as your main content. So it does not have access to any styles/script defined in your main document.

Thanks!
Back to top
 
Prasanna
Posted: Monday, April 11, 2022 5:07:10 PM
Rank: Newbie
Groups: Member

Joined: 8/6/2018
Posts: 7
Hi,

Thanks for your response. I used the inline javascript file and styles but still it's not working.

For example, i used the below code in my HTML page.

<script language="javascript" type="text/javascript">

(function () {
var urlParams = decodeURI(document.location.search.substring(1)).split('&');

var pagingElements = ['page', 'section', 'subsection', 'disclaimer', 'topage'];

var section = "";
var subsection = "";
var page = "";
var topage = "";
var disclaimer = "";

for (var i in urlParams) {
var param = urlParams[i].split('=', 2);

if (param[0] === 'section') {
section = unescape(param[1]);
}
else if (param[0] === 'subsection') {
subsection = unescape(param[1]);
}
else if (param[0] === 'disclaimer') {
disclaimer = unescape(param[1]);
}
else if (param[0] === 'page') {
page = unescape(param[1]);
}
else if (param[0] === 'topage') {
topage = unescape(param[1]);
}
}

if (disclaimer && disclaimer !== '' && page && page!== '' && page===disclaimer) {
document.getElementById('disclaimer').style.display = 'inline-block';
}

var pagecontinuation = document.getElementById('pagecontinuation');
var pagecontinuationstatic = document.getElementById('pagecontinuationstatic');
var pagecontinuationholder = document.getElementById('pagecontinuationholder');

if (section && section !== "") {
if ((subsection && subsection !== '' && subsection === (section + '_Last')) || page === topage) {
if (pagecontinuation.style) {
pagecontinuation.style.display = 'none';
}
if (pagecontinuationstatic.style) {
pagecontinuationstatic.style.display = 'none';
}
if (pagecontinuationholder.style) {
pagecontinuationholder.style.display = 'none';
}
}
else {
pagecontinuation.textContent = section;
}
}
else {
if (pagecontinuation.style) {
pagecontinuation.style.display = 'none';
}
if (pagecontinuationstatic.style) {
pagecontinuationstatic.style.display = 'none';
}
if (pagecontinuationholder.style) {
pagecontinuationholder.style.display = 'none';
}
}
})();
</script>

Please let me know if you need more information.
Back to top
 
eo_support
Posted: Monday, April 11, 2022 6:05:46 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,217
Hi,

You can not use the same code you use in your main code. Again this is because header/footer are not rendered inside the same document as the main document. As such while your main doucment has document.location, your header/footer does not have that. This means any code relying on that won't work. So you will need to rewrite that part of the code.

The other factor you must consider is anything you put in your header/footers are repeated during rendering. So for example, if your header HTML is as the following and your document is 3 pages long:

Code: HTML/ASPX 
<p id="header">header</p>


Then during the rendering the process, the browser engine will render the following HTML:

Code: HTML/ASPX 
<p id="header">header</p>
<p id="header">header</p>
<p id="header">header</p>

As you see the header HTML is repeated 3 times because the document has 3 pages. Obviously you would run into problems if you have JavaScript code that relies on id "header" since now you have three of them.

Because of this it is not a good idea to use JavaScript in header/footer (remember your JavaScript code will be repeated as well, which can cause additional problems for you). If you must dynamically generates header/footer HTML, genearate it in your C# code and then set HtmlToPdf.HeaderHtmls/FooterHtmls directly:

https://www.essentialobjects.com/doc/eo.pdf.htmltopdfoptions.headerhtmls
https://www.essentialobjects.com/doc/eo.pdf.htmltopdfoptions.footerhtmls

Thanks!
Back to top
 


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.