0

Fiz um formulário em HTML e gostaria que ao clicar em um botão na página, inicia-se o dowload da página com formulário preenchido em pdf ou outro formato possível.

Fiz isso com mpdf, o problema é que não posso copiar a página sempre, por se tratar de um formulário:

<?php
    include("mpdf60/mpdf.php");

    $html = "
    <style type='text/css'>
.container-fluid{
    padding:0%;
}
.logo{
    width:200px;
    height:80px;
}
.coluna{
    background-color: #e5e3e3;
    height:1345px;
}
.numeros{
    width:22px;
    height:22px;
    margin-bottom:9px;
}
.titulo{
    font-family: Arial, Verdana;
    font-size: 20px;
    margin-bottom: 0px;
}
.botao, .fundo{
    background-image: linear-gradient(to bottom, #FFFFFF, #F0F0F0);  
    border: solid 1px #c0c0c0;
}
.botao:hover{
    background-image: linear-gradient(to bottom, #F0F0F0, #F0F0F0); 
}
.botao1{
    background-color: #c0c0c0;
    color:#ffffff;
}
.botao1:hover{
    background-color: #7c7474;
    border: solid 1px #c0c0c0;
    color:#ffffff;
}
.botao2{
    background-color: #fcbd11;
    color:#ffffff;
}
.botao2:hover{
    background-color: #cc8f0c;
    border: solid 1px #ffaa00;
    color:#ffffff;
}
@media screen and (max-width: 991px){
.botao1{
    width:100%;
    padding: 8px;
    margin-top: 10px;
}
}
</style>
<script type='text/javascript'>
 function mascara(t, mask){
 var i = t.value.length;
 var saida = mask.substring(1,0);
 var texto = mask.substring(i)
 if (texto.substring(0,1) != saida){
 t.value += texto.substring(0,1);
 }
 }
</script>
</head>
<body>
    <div class='container clearflix'>
        <div class='row-fluid'>
            <img class='logo' src='image/logo.jpg' title=''/>
        </div>
        <div class='row-fluid' style='width:100%;height:1px;background-color:#e5e3e3;margin:0%;padding:0%'></div>
        <form name='cadastro_cliente'>
            <div class='row-fluid'>
                <div class='col-md-12'>
                    <div class='row'>
                        <br>
                        <br>
                        <div class='col-md-12'>
                            <p class='titulo'>Busca de Cliente</p>
                            <div class='row' style='width:100%;height:1px;background-color:#12e824;margin:0%;padding:0%'></div>
                        </div>
                    </div>
                    <div class='row has-success' style='margin-top:1%'>
                        <div class='col-md-7'>
                            <input type='text' class='form-control' name='txtcliente' placeholder='Nome do Cliente...'' aria-describedby='helpBlock2'>
                        </div>


                </div>
            </div>
        </form><!---fechamento do formulário-->
    </div><!---fechamento da div class container-fluid-->
</body>";

$mpdf=new mPDF();
$mpdf->SetDisplayMode('fullpage');
//$css = file_get_contents("css/estilo.css");
$mpdf->WriteHTML($html);
$mpdf->Output();

exit;
13
  • já tentou escrever o pdf gerado? você também pode criar um arquivo temporário Commented 8/03/2016 às 19:50
  • ñ entendi, como assim?
    – Sarah
    Commented 8/03/2016 às 19:52
  • 1
    window.print(); , esse comando imprime o html inteiro, para definir o estilo da sua pagina antes de imprimir, use no css @media print que faz o layout da página para caso vá imprimir Commented 8/03/2016 às 20:33
  • 1
    agora se quiser imprimir uma parte especifica da sua pagina, pode fazer assim var conteudo = document.getElementById('sua_div').innerHTML; impressao = window.open('about:blank'); impressao.document.write(conteudo); impressao.window.print(); impressao.window.close(); isso vai pegar o conteudo que você quer, jogar em outra pagina, imprimir de encerrar a pagina. Commented 8/03/2016 às 20:38
  • 1
    O ideal seria enviar o form para o PHP do MPDF, e o PHP gerar o PDF final, usando os campos do form. Apesar de você ter aceito uma resposta que funciona no chrome, não é uma solução que funciona em qualquer lugar e navegador. A resposta é válida, mas tem como fazer algo mais "universal".
    – Largato
    Commented 8/03/2016 às 21:46

1 Resposta 1

1

Usando as APIs do próprio broswer fica mais fácil para lançar o pdf.

<!doctype html>

<html>
    <head>
        <style>
            @media print{
                /*Estilo da impressão*/
            }
        </style>
        <script>
            function doc_print(){
                window.print();
            }
            window.onload = function(){
                // window.print(); (opicional)
                doc_print();
            }
        </script>
    </head>
    <body>
        <!-- Conteúdo da impressão -->
    </body>
</html>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .