Generating PDF files with PHP and FPDF

PHP allows you to generate PDF files dynamically, which can be useful for a variety of tasks. FPDF is a free PHP class containing a number of functions that let you create and manipulate PDFs.

PDFlib

The PHP API contains a number of functions for handling PDF files designed to be used with the PDFlib. Although extensive, this library is not free for commercial use. A free version called PDFlib Lite is available for personal use, but is limited in functionality. To use the full PDFlib library you must purchase a rather expensive license.

Why FPDF?

An alternative way of generating PDF files with PHP is using FPDF, a free PHP class containing a number of functions for creating and manipulating PDFs. The key word here is free. You are free to download and use this class or customise it to fit your needs. In addition to being free, it’s also simpler to use than PDFlib. The PDFlib needs to be installed as an extension in your PHP package, whereas FPDF can just be included in your PHP script and it’s ready to use.

Creating PDF files

To get started, you will need to download the FPDF class from the FPDF Web site and include it in your PHP script like this:

require(‘fpdf.php’);

Below is an example of how you can generate a simple PDF using FPDF.

We begin by creating a new FPDF object with:

$pdf= new FPDF();

The FPDF constructor can take the following parameters:

|>String orientation (P or L) — portrait or landscape
|>String unit (pt,mm,cm and in) — measure unit
|>Mixed format (A3, A4, A5, Letter and Legal) — format of pages

Next, we are going to set some document properties:

$pdf->SetAuthor(‘Lana Kovacevic’);
$pdf->SetTitle(‘FPDF tutorial’);

Because we want to use the same font throughout the whole document, we can set it before we create a page.

$pdf->SetFont(‘Helvetica’,'B’,20);
$pdf->SetTextColor(50,60,100);

The SetFont function takes three parameters; the font family, style and size. We are using Helvetica, Bold and 20 points, which will be applied to the title of our document. You can either use one of the regular font families or set up a different one using the AddFont () function.

With SetTextColor () we are also setting the font colour for the entire document. The colours can be represented as RGB or grey scale. Here we are using RGB values.

Now that that’s done, let’s set up a page for our PDF document.

$pdf->AddPage(‘P’);
$pdf->SetDisplayMode(real,’default’);

You can pass the AddPage () a parameter of “P” or “L” to specify the page orientation. I’ve used “P” for portrait. The SetDisplayMode function determines how the page will be displayed. You can pass it zoom and layout parameters. Here we’re using 100 percent zoom and the viewer’s default layout.

Now, that we’ve set up a page, let’s insert an image to make it look nicer and make it a link while we’re at it. We’ll display the FPDF logo by calling the Image function and passing it the following parameters — name of the file, the dimensions and the URL.

$pdf->Image(‘logo.png’,10,20,33,0,’ ‘,’http://www.fpdf.org/’);

You could have also inserted the link with:

$pdf->Link(10, 20, 33,33, ‘http://www.fpdf.org/’);

Now let’s make a title for our document with a border around it.

$pdf->SetXY(50,20);
$pdf->SetDrawColor(50,60,100);
$pdf->Cell(100,10,’FPDF Tutorial’,1,0,’C',0);

The SetXY function sets the position of x and y coordinates, where we want the title to appear. SetDrawColor will set the colour of the border, using RGB values. After that’s done, we call the Cell function to print out a cell rectangle along with the text of our title. We are passing the function the following parameters; width, height, text, border, ln, align and fill. The border is either 0 for no border or 1 for frame. For ln we are using the default value 0, “C” to centre align the text inside it and 0 for fill. Had we used 1 for fill the rectangle would have been coloured in. With a value of 0 we are making it transparent.

Now we want to write the main text to the PDF, that is display a little message.

$pdf->SetXY(10,50);
$pdf->SetFontSize(10);
$pdf->Write(5,’Congratulations! You have generated a PDF. ‘);

Again we are setting the x and y positions of the text, but this time we are reducing the font size with the SetFontSize function. The write function will print the text to a PDF. The parameter 5 will set the line height. This is only relevant however, if there are multiple lines of text.

Finally we want to send the output to a given destination, using the Output function.

$pdf->Output(‘example1.pdf’,'I’);

Here we are passing the function the name of the file and the destination, in this case “I”. The “I” parameter will send the output to the browser.

Putting it all together:

SetAuthor(‘Lana Kovacevic’);
$pdf->SetTitle(‘FPDF tutorial’);

//set font for the entire document
$pdf->SetFont(‘Helvetica’,'B’,20);
$pdf->SetTextColor(50,60,100);

//set up a page
$pdf->AddPage(‘P’);
$pdf->SetDisplayMode(real,’default’);

//insert an image and make it a link
$pdf->Image(‘logo.png’,10,20,33,0,’ ‘,’http://www.fpdf.org/’);

//display the title with a border around it
$pdf->SetXY(50,20);
$pdf->SetDrawColor(50,60,100);
$pdf->Cell(100,10,’FPDF Tutorial’,1,0,’C',0);

//Set x and y position for the main text, reduce font size and write content
$pdf->SetXY (10,50);
$pdf->SetFontSize(10);
$pdf->Write(5,’Congratulations! You have generated a PDF.’);

//Output the document
$pdf->Output(‘example1.pdf’,'I’);
?>

Now that you’ve learnt how to generate a simple PDF, let’s see what else we can do with FPDF. The example code below demonstrates how to make a header and a footer for your document.

Image(‘logo.png’,10,8,33);
$this->SetFont(‘Helvetica’,'B’,15);
$this->SetXY(50, 10);
$this->Cell(0,10,’This is a header’,1,0,’C');
}

function Footer()
{
$this->SetXY(100,-15);
$this->SetFont(‘Helvetica’,'I’,10);
$this->Write (5, ‘This is a footer’);
}
}

$pdf=new PDF();
$pdf->AddPage();
$pdf->Output(‘example2.pdf’,'D’);
?>

As you can see we are creating a child class of FPDF using inheritance and setting up the behaviour for both the Header and Footer functions. We then create a new object of this PDF class and add a page to our document. The AddPage () will automatically call the Header and Footer. Finally, we output it to a file called example2.pdf, this time using the “D” option for the sake of the example. This will send the file to the browser and open a dialog box, prompting the user to save the file.

Now that you have an understanding of how FPDF works, go ahead and play with some of its functions and have fun building your own PDFs. For the full list of functions, refer to the FPDF Web site.

Is Smarty right for me?

Although Smarty is known as a “Template Engine”, it would be more accurately described as a “Template/Presentation Framework.” That is, it provides the programmer and template designer with a wealth of tools to automate tasks commonly dealt with at the presentation layer of an application. I stress the word Framework because Smarty is not a simple tag-replacing template engine. Although it can be used for such a simple purpose, its focus is on quick and painless development and deployment of your application, while maintaining high-performance, scalability, security and future growth.

Here are some of the more notable features of Smarty:

Caching: Smarty provides fine-grained caching features for caching all or parts of a rendered web page, or leaving parts uncached. Programmers can register template functions as cacheable or non-cachable, group cached pages into logical units for easier management, etc.

Configuration Files: Smarty can assign variables pulled from configuration files. Template designers can maintain values common to several templates in one location without intervention from the programmer, and config variables can easily be shared between the programming and presentation portions of the application.

Security: Templates do not contain PHP code. Therefore, a template designer is not unleashed with the full power of PHP, but only the subset of functionality made available to them from the programmer (application code.)

Easy to Use and Maintain: Web page designers are not dealing with PHP code syntax, but instead an easy-to-use templating syntax not much different than plain HTML. The templates are a very close representation of the final output, dramatically shortening the design cycle.

Variable Modifiers: The content of assigned variables can easily be adjusted at display-time with modifiers, such as displaying in all upper-case, html-escaped, formatting dates, truncating text blocks, adding spaces between characters, etc. Again, this is accomplished with no intervention from the programmer.

Template Functions: Many functions are available to the template designer to handle tasks such as generating HTML code segments (dropdowns, tables, pop-ups, etc.), displaying content from other templates in-line, looping over arrays of content, formatting text for e-mail output, cycling though colors, etc.

Filters: The programmer has complete control of template output and compiled template content with pre-filters, post-filters and output-filters.

Resources: Templates can be pulled from any number of sources by creating new resource handlers, then using them in the templates.

Plugins: Almost every aspect of Smarty is controlled through the use of plugins. They are generally as easy as dropping them into the plugin directory and then mentioning them in the template or using them in the application code. Many user-community contributions are also available. (See the plugins section of the forum and wiki.)

Add-ons: Many user-community contributed Add-ons are available such as Pagination, Form Validation, Drop Down Menus, Calendar Date Pickers, etc. These tools help speed up the development cycle, there is no need to re-invent the wheel or debug code that is already stable and ready for deployment. (see the Add-ons section of the forum and wiki.)

Debugging: Smarty comes with a built-in debugging console so the template designer can see all of the assigned variables and the programmer can investigate template rendering speeds.

Compiling: Smarty compiles templates into PHP code behind the scenes, eliminating run-time parsing of templates.

Performance: Smarty performs extremely well, despite its vast feature set. Most of Smarty’s capabilities lie in plugins that are loaded on-demand. Smarty comes with numerous presentation tools, minimizing your application code and resulting in quicker, less error-prone application development/deployment. Smarty templates get compiled to PHP files internally (once), eliminating costly template file scans and leveraging the speed of PHP op-code accelerators.

So is Smarty right for you? What it comes down to is using the right tool for the job. If you want simple variable replacement, you might want to look at something simpler or even roll your own. If you want a robust templating framework with numerous tools to assist you as your application evolves into the future, Smarty is likely a good choice.

Convert Text to Uppercase

Converting a text string to uppercase is very easy using the JavaScript toUpperCase() method.

This script takes the input from the first text field and outputs it to the second. You can adapt the script to accept and output the string in other ways.

Place the following code in the document head:

function makeUppercase() {
document.form1.outstring.value = document.form1.instring.value.toUpperCase();
}

Place the following code in the document body. This includes two text fields (one for the input and one for the resulting output) and a button to initiate the conversion:

>” onClick=”makeUppercase();”>

20 Top jQuery tips & tricks for jQuery programmers

Following are few very useful jQuery Tips and Tricks for all jQuery developers.
1. Optimize performance of complex selectors

Query a subset of the DOM when using complex selectors drastically improves performance:
1.var subset = $(“”);
2.$(“input[value^='']“, subset);
2. Set Context and improve the performance

On the core jQuery function, specify the context parameter when. Specifying the context parameter allows jQuery to start from a deeper branch in the DOM, rather than from the DOM root. Given a large enough DOM, specifying the context parameter should translate to performance gains.
1.$(“input:radio”, document.forms[0]);
3. Live Event Handlers

Set an event handler for any element that matches a selector, even if it gets added to the DOM after the initial page load:
1.$(‘button.someClass’).live(‘click’, someFunction);

This allows you to load content via ajax, or add them via javascript and have the event handlers get set up properly for those elements automatically.

Likewise, to stop the live event handling:
1.$(‘button.someClass’).die(‘click’, someFunction);

These live event handlers have a few limitations compared to regular events, but they work great for the majority of cases. Live event will work starting from jQuery 1.3
4. Checking the Index

jQuery has .index but it is a pain to use as you need the list of elements and pass in the element you want the index of
1.var index = e.g $(‘#ul>li’).index( liDomObject );

The following is easier:

if you want to know the index of an element within a set, e.g. list items within a unordered list:
1.$(“ul > li”).click(function ()
2.{
3. var index = $(this).prevAll().length;
4.});
5. Use jQuery data method

jQuery’s data() method is useful and not well known. It allows you to bind data to DOM elements without modifying the DOM.
6. Fadeout Slideup effect to remove an element

Combine more than one effects in jQuery to animate and remove an element from DOM.
1.$(“#myButton”).click(function() {
2. $(“#myDiv”).fadeTo(“slow”, 0.01, function(){ //fade
3. $(this).slideUp(“slow”, function() { //slide up
4. $(this).remove(); //then remove from the DOM
5. });
6. });
7.});
7. Checking if an element exists

Use following snippet to check whether an element exists or not.
1.if ($(“#someDiv”).length) {
2. //hooray!!! it exists…
3.}
8. Add dynamically created elements into the DOM

Use following code snippet to create a DIV dynamically and add it into the DOM.
1.var newDiv = $(‘

‘);
2.newDiv.attr(“id”,”myNewDiv”).appendTo(“body”);
9. Line breaks and chainability

Instead of doing:
1.$(“a”).hide().addClass().fadeIn().hide();

You can increase readability like so:
1.$(“a”)
2. .hide()
3. .addClass()
4. .fadeIn()
5. .hide();
10. Creating custom selectors
01.$.extend($.expr[':'], {
02. over100pixels: function(a) {
03. return $(a).height() > 100;
04. }
05.});
06.
07.$(‘.box:over100pixels’).click(function() {
08. alert(‘The element you clicked is over 100 pixels high’);
09.});
11. Cloning an object in jQuery

Use .clone() method of jQuery to clone any DOM object in JavaScript.
1.// Clone the DIV
2.var cloned = $(‘#somediv’).clone();

jQuery’s clone() method does not clone a JavaScript object. To clone JavaScript object, use following code.
1.// Shallow copy
2.var newObject = jQuery.extend({}, oldObject);
3.
4.// Deep copy
5.var newObject = jQuery.extend(true, {}, oldObject);
12. Test if something is hidden using jQuery

We use .hide(), .show() methods in jquery to change the visibility of an element. Use following code to check the whether an element is visible or not.
1.if($(element).is(“:visible”) == “true”) {
2. //The element is Visible
3.}
13. Alternate way of Document Ready
1.//Instead of
2.$(document).ready(function() {
3. //document ready
4.});
5.//Use
6.$(function(){
7. //document ready
8.});
14. Selecting an element with . (period) in its ID

Use backslash in the selector to select the element having period in its ID.
1.$(“#Address\\.Street”).text(“Enter this field”);
15. Counting immediate child elements

If you want to count all the DIVs present in the element #foo
01.

02.

03.

04.

05.

06.
07.

08.
09.//jQuery code to count child elements
10.$(“#foo > div”).size()
16. Make an element to “FLASH”
1.jQuery.fn.flash = function( color, duration )
2.{
3. var current = this.css( ‘color’ );
4. this.animate( { color: ‘rgb(‘ + color + ‘)’ }, duration / 2 );
5. this.animate( { color: current }, duration / 2 );
6.}
7.//Then use the above function as:
8.$( ‘#importantElement’ ).flash( ’255,0,0′, 1000 );
17. Center an element on the Screen
01.jQuery.fn.center = function () {
02. this.css(“position”,”absolute”);
03. this.css(“top”, ( $(window).height() – this.height() ) / 2+$(window).scrollTop() + “px”);
04. this.css(“left”, ( $(window).width() – this.width() ) / 2+$(window).scrollLeft() + “px”);
05. return this;
06.}
07.
08.//Use the above function as:
09.$(element).center();
18. Getting Parent DIV using closest

If you want to find the wrapping DIV element (regardless of the ID on that DIV) then you’ll want this jQuery selector:
1.$(“#searchBox”).closest(“div”);
19. Disable right-click contextual menu

There’s many Javascript snippets available to disable right-click contextual menu, but JQuery makes things a lot easier:
1.$(document).ready(function(){
2. $(document).bind(“contextmenu”,function(e){
3. return false;
4. });
5.});
20. Get mouse cursor x and y axis

This script will display the x and y value – the coordinate of the mouse pointer.
1.$().mousemove(function(e){
2. //display the x and y axis values inside the P element
3. $(‘p’).html(“X Axis : ” + e.pageX + ” | Y Axis ” + e.pageY);
4.});