Page break when HTML to PDF with AbcPdf

Question

I'm trying to create a report in PDF with abcPdf. Everything works but I would like to add a page number and margin at the bottom of each page as well as avoid cuts in the middle of a row as you can see in the picture:

var theDoc = new Doc { TopDown = true };
var pageRef = theDoc.AddImageUrl(pdfUrl, true, 1903, true);
while (theDoc.Chainable(pageRef))
{
    theDoc.Page = theDoc.AddPage();
    //I guessI have to do something here???
    pageRef = theDoc.AddImageToChain(pageRef);
}

Does somebody know if it is possible?

Placable

I don't know about AbcPdf, but some PDF-libs can interpret CSS definitions like page-break: before; upon selected elements. – Razee

It did work but I think AbcPdf is using the HTML rendering of IE so the best thing you can do is to manually set the rendering engine to be gecko ( theDoc.HtmlOptions.Engine = EngineType.Gecko; ) or to update IE in your web server. Then to add a page break just use <div style="page-break-before:always">&nbsp;</div> – Placable

Answer 1

It did work but I think AbcPdf is using the HTML rendering of IE so the best thing you can do is to manually set the rendering engine to be gecko (Dont forget that you need and extra DLL) or to update IE in your web server.

theDoc.HtmlOptions.Engine = EngineType.Gecko; 

Then to add a page break just use

<div style="page-break-before:always">&nbsp;</div> 

Thanks to feeela for the comment.

Placable

If you have a continuous table stretching over several pages, then how do you know where to render the <div>? – Davao

Exactly, how to stop stretching on continuous tables? – Oliveira

Anyone find the real answer to this? – Oliveira

You would need to work out the size of a page then the size of an item and come up with a maxim number of items to display before you add a page break to the HTML, that the only way I have found you can do it. – Department

Answer 2

ABCpdf includes two HTML rendering engines.

The MSHTML one is based around Trident and will produce output broadly similar to the version of IE installed on your system.

The Gecko one is based around Firefox and as of June 2013 will produce output broadly similar to that you see in Firefox 21.

You can switch between the two engines using the Doc.HtmlOptions.Engine property.

Both engines support the page-break CSS styles. You can use the following:

<div style="page-break-before:always">some text</div>
<div style="page-break-after:always">some text</div> 
<div style="page-break-inside:avoid">some text</div> 

Note that the page-break-inside is an addition to the base MSHTML behavior.

The two engines treat these constructs slightly differently. In general MSHTML is more forgiving and intuitive. Howwever the element to which the style is applied must be visible for it to work.

As such, if the styles don't produce breaks in the places you would expect, the easiest way to debug them is to apply a border style to the element so you can see where the break should occur. This normally makes the cause of the problem obvious.

The page break styles in the Gecko engine are not always applied as intuitively as they are in MSHTML. The root of this is the CSS specification that which says that break styles must be appliable to block-level elements within the "normal flow of the root element". It allows for these styles to be applied to other elements but does not mandate it.

The upshot of this, within the Gecko engine, is that page break styles cannot be applied within tables, to elements such as table rows. If you are unsure about whether something is likely to work just try Print Preview from within Firefox 21.0 as a simple sanity check.

Decent

Answer 3

There is a better way for fixing this. Instead of putting this <div /> to force Page breaking, you could put a CSS attribute on the container of your html (ie <div />, <table />, etc). In the css set the page-break-inside to auto .

// in CSS
#ContainerID
{
    page-break-inside: auto;
}

Arlyne

Auto is the default, so in practice this will have no effect. – Acrid

I am not sure if it is a default setting, but I am certain it works. I have used it in my app and it does the job. The other part of the solution is the fact that u can apply the CSS class on any html element, which was not mentioned before. Thus, I am not sure why do u vote it down?? is there something wrong, happy to correct if any!! – Arlyne

Can't deny it works, worked in my project and yes it is auto by default but it still needs to be placed to take affect. Wrapping in css class or id is sound! – Rhapsodic

Answer 4

Yeah I've dealt with this issue we solved it by adding a row to the table and seeing if it would still fit on the page by checking the height of the html vs the rectangle.

It works nicely once all setup but is a little slower

Anthropomorphize