Linguagem PHP: 1ª Parte (Formulário) – Gerar um documento em PDF usando a biblioteca FPDF.


Jbwebmaster – João Batista Dantas Bezerra Júnior

Olá pessoal, hoje vamos aprender como gerar um documento em PDF usando a biblioteca FPDF, uma das mais utilizadas em PHP, será dividido em  2 partes. Na 1ª parte, para ficar mais completo, desenvolvi uma página em PHP + HTML  contendo um formulário que vai ser o responsável por enviar os dados para a outra página em PHP que ficará responsável por gerar o arquivo em PDF no navegador, você também verá que pode optar por: envia para o browser e forçar o download do arquivo e por salvar em um arquivo local. O objetivo é a criação do PDF através de parâmetros fornecidos pelo formulário mostrado nessa 1ª parte, portanto os detalhes ficam a cargo do script PHP que virá na 2ª parte deste artigo. Esse formulário envia os dados pelo método do tipo POST, um formulário simples. Também desenvolvi o CSS dessa página, os códigos seguem abaixo:

MetasTags.php

Metas Tags, que são etiquetas que descrevem o conteúdo do seu site para os buscadores. Poderá baixar o arquivo no link: MetasTags.php. As Metas Tags usadas foram:
– A meta tag (meta http-equiv=”content-language” content=”pt-br”), serve para referenciar a linguagem do conteúdo da página.
– A meta tag (meta http-equiv=”content-type” content=”text/html; charset=UTF-8″), serve para informar o conjunto de caracteres dentro da página.
– A meta tag (meta name=”title” content=”Gerar um documento em PDF usando a biblioteca FPDF.”), informa o título do documento.
– A meta tag (meta name=”author” content=”Joao Batista Dantas Bezerra Junior”), informa o autor da página.
– A meta tag (meta name=”robots” content=”index,follow” ), essa meta tag é muito importante, pois será responsável por dizer se seu site ficará visível nos sites de busca ou não.
– A meta tag (meta name=”generator” content=”NetBeans IDE 6.9” ), informa qual Software foi utilizado para a construção da página. Conheça mais sobre metas tags.
OBS: Perceba que no código fonte existe uma contra barra (\) antes de cada aspa (“), esse é o caracter de controle e serve para escapar as aspas, interpretando como uma string.

Código Fonte:

<?php
echo "  <meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
        <meta http-equiv=\"content-language\" content=\"pt\" />
        <meta name=\"title\" content=\"Gerar um documento em PDF usando a biblioteca FPDF.\" />
        <meta name=\"author\" content=\"Joao Batista Dantas Bezerra Junior\" />
        <meta name=\"robots\" content=\"index,follow\" />
        <meta name=\"generator\" content=\"NetBeans IDE6.9\" />
";
?>

Página index.php

Essa página será responsável por enviar os parâmetros ou dados para a página PHP que gera o PDF, servindo de suporte aqueles que queiram saber como fazer para enviar os dados através do formulário. Poderá baixar o arquivo no link: index.php. Bem, com essa página você poderá usar como base para a sua, não perdendo mais tempo, como já disse anteriormento não entrarei em detalhes na construção do formulário, orientação das DIVs e etc, pois esse não é o objetivo desse post. O HTML já foi validado pela W3C.

Código Fonte:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <!--
    *******************************************************************************
    *     JBWEBMASTER - Gerar um documento em PDF usando a biblioteca FPDF        *
    *                AUTOR: JOAO BATISTA DANTAS BEZERRA JUNIOR                    *
    *                E-MAIL: jbtrab@gmail.com                                     *
    *                        DATA: 28/09/2010                                     *
    *******************************************************************************
    -->
    <head>
        <?php include_once 'MetasTags.php'; ?>
        <title>Gerar um documento em PDF usando a biblioteca FPDF.</title>
        <!--ESTILO DA PAGINA FORMULARIO-->
        <link href="estilo.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div class="cabecalho">
            <h2>Gerar um documento em PDF usando a biblioteca FPDF.</h2>
            <div class="contato"><a href="https://jbwebmaster.wordpress.com/" title="Voltar para P&aacute;gina inicial">
                    Natal/RN 2010 - Desenvolvido por: Jo&atilde;o Batista Dantas B. J&uacute;nior - JBWEBMASTER -
                    CONTATO/D&Uacute;VIDAS: jbtrab@gmail.com</a></div>
        </div>
        <div class="central">
            <div class="frmManut">
                <form method="post" action="PaginaPdf.php" name="frmLista" target="blank">

                    <div class="titulo">Documento da Empresa X</div>
                    <div class="colunaUmLinhaUm">
                        <p>
                            <label for="numeroProcesso">N&uacute;mero do Processo:</label>
                            <br />
                            <input type="text" name="numeroProcesso" value="" />
                        </p>
                        <p>
                            <label for="notaFiscal">N&uacute;mero Nota Fiscal:</label>
                            <br />
                            <input type="text" name="notaFiscal" value="" />
                        </p>
                        <p>
                            <label for="nomeEmpresa">Nome da Empresa:</label>
                            <br />
                            <input type="text" class="nomeEmpresa" name="nomeEmpresa" value="" />
                        </p>
                    </div>
                    <div class="colunaDoisLinhaUm">
                        <p>
                            <label for="numeroFolhas">N&uacute;mero das Folhas:</label>
                            <br />
                            <input type="text" name="numeroFolhas" value="" />
                        </p>
                        <p>
                            <label for="dataDoc">Data do Documento:</label>
                            <br />
                            <input type="text" class="dataDoc" name="dataDoc" value="" />
                        </p>
                        <p>
                            <label for="nomeResponsavel">Nome do Respons&aacute;vel:</label>
                            <br />
                            <input type="text" class="nomeResponsavel" name="nomeResponsavel" value="" />
                        </p>
                    </div>
                    <div class="colunaTresLinhaUm">
                        <p>
                            <label for="TipoResponsavel">Tipo do Respons&aacute;vel:</label>
                            <br />
                            <select name="TipoResponsavel">
                                <option>Estagi&aacute;rio</option>
                                <option>Contratado</option>
                            </select>
                        </p>
                        <p>
                            <label for="matricula">Matr&iacute;cula:</label>
                            <br />
                            <input type="text" class="matricula" name="matricula" value="" />
                        </p>
                    </div>
                    <p>
                        <span><input type="submit" value="Gerar o Documento em PDF" name="enviar" /></span>
                    </p>
                </form>
            </div>
        </div>
        <div class="rodape">
           Natal/RN 2010 - Desenvolvido por: Jo&atilde;o Batista Dantas B. J&uacute;nior - JBWEBMASTER - CONTATO/D&Uacute;VIDAS: jbtrab@gmail.com
        </div>
    </body>
</html>

Página estilo.css

Página de estilo responsável por toda configuração da página index.php. Poderá baixar o arquivo no link: estilo.css.

Código Fonte:

@charset "utf-8";
/* 
    Document: CSS 
    Created on: 16/10/2010, 10:44:03
    Author: Joao Batista Dantas B. Júnior
    Contato: jbtrab@gmail.com
*/
* {
    margin:0px;
    padding:0px;
    top:0px;
    left:0px;
    position: relative;
    text-align:center;
}
body{
    background-image:url(fundo.PNG);
    background-color:#C0C0C0;
    background-repeat:repeat;
    background-attachment:fixed;
    padding-top:5px;
    padding-bottom:5px;
    font-weight: bolder;
    color: #000000;
    font: 80% Arial, Helvetica, sans-serif;
}

.cabecalho{
    background-image: url(novoLay2.png);
    background-repeat:repeat-x;
    margin: auto;
    width: 100%;
    height: 140px;
}

.contato{
    font-size: 100%;
    font-family: verdana;
    font-weight: bolder;
    margin-top:6px;
    width: 100%;
    height: auto;
    position: absolute;
    color: white;
}
.contato a:link{
    text-decoration: none;
    color: #000000;
}
.contato a:hover{
    text-decoration: none;
    color: #000099;
}
.contato a:visited{
    text-decoration: none;
    color: #000000;
}
.cabecalho h2{
    font-size: 180%;
    font-family: verdana;
    font-weight: bolder;
    margin-top:50px;
    width: 100%;
    height: auto;
    position: absolute;
    color: white;
}
.central{
    background-color: #C0C0C0;
    padding-top:20px;
    padding-bottom:20px;
    margin: auto;
    margin-top: 50px;
    margin-bottom: 50px;
    width:900px;
    height:auto;
}

/*Formulario de manutencao*/
div.frmManut{
    width:auto;
    height:auto;
    margin:auto;
    font-size: 95%;
    font-weight:bolder;
    text-align:left;
}
div.frmManut .numero{
    width: 100px;
}
div.frmManut form input{
    text-align:left;
    border-left-style:solid;
    border-left-color:gray;
    border-top-style:solid;
    border-top-color:gray;
    text-align:left;
    width: 200px;
}
div.frmManut form select{
    text-align:left;
    border-left-style:solid;
    border-left-color:gray;
    border-top-style:solid;
    border-top-color:gray;
    text-align:left;
    width: 200px;
}
div.frmManut span input{
    padding: 10px;
    margin: auto;
    margin-top: 90px;
    margin-left: 75px;
    background-color:#000099;
    color:white;
    text-align:center;
    font-size:110%;
    font-weight:bolder;
    border-style: outset;
    border-width: 4px;
    border-color: white;
    cursor:pointer;
    width: auto;
}
div.frmManut form p{
    padding-bottom:10px;
    text-align:justify;
}
/*PAGINA UM DO TERMO*/
div.frmManut form .titulo{
    background-color: #ccccaf;
    padding-top: 15px;
    padding-bottom: 15px;
    width: auto;
    height: auto;
    text-align:center;
    font-size: 140%;
    color:#000099;
}
div.frmManut form .colunaUmLinhaUm {
    margin-top: 10px;
    margin-left:75px;
    position:relative;
    width: 250px;
    height: auto;
}
div.frmManut form .colunaDoisLinhaUm {
    margin-top: -131px;
    margin-left:345px;
    position:relative;
    width: 250px;
    height: auto;
}
div.frmManut form .colunaTresLinhaUm {
    margin-top: -133px;
    margin-left:605px;
    position:relative;
    width: 250px;
    height: auto;
}

/************   RODAPE   *************/

div.rodape{
    padding-bottom: 6px;
    padding-top: 6px;
    cursor: text;
    font-weight:bolder;
    margin:auto;
    width: 100%;
    height: auto;
    background-color:#fff34f;

}

7 thoughts on “Linguagem PHP: 1ª Parte (Formulário) – Gerar um documento em PDF usando a biblioteca FPDF.

    1. Obrigado!
      Todos os posts que estou criando gira em torno de resoluções a problemas encontrados no meu dia a dia, pensando nisso desenvolvi esse blog para socializar essas informações e se tiver alguma ideia ou problema me mande um comentário ou encaminhe por email.

  1. Boa tarde João Batista,
    Muito bom o post, eu adaptei ele para criação de uma ata de reunião e ficou perfeito !!
    Muito obrigado.
    Mas gostaria de te fazer uma pergunta..
    Como eu faria para direcionar o arquivo pdf para um BLOB em mysql ?
    Agradeço desde já,
    e pesso desculpas por postar em um post já antigo, mas é que eu não achei um post que eu conseguisse adaptar !

    Renato Rodrigues de Araujo
    renato.r.araujo@gmail.com

    1. Rapaz to cheio de idéias para acrescentar, porém to com pouquíssimo tempo ultimamente, mas vou dar um geito de responder tudo…blz!

  2. Alguem pode ajudar,? quero integrar um questinario num site, com 30 perguntas de escolha multipla, e umas 5 caixas de texto. Ao confirmar dados quero Que gere um pdf configurado num layout Que eu fiz, e seja possivel descaregar o ficheiro. Quanto tempo demora este trabalho? é que pedi alguem para faxer e diz me que preciso de 1 dia por pdf… é que são w20 PDF e não posso esperar tanto tempo

Deixe uma resposta

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s