Button for downloading HTML form

Navigation
0

I made an HTML form and I would like that when clicking a button on the page, the download of the page with form filled in pdf or another possible format starts.

I did this with mpdf, the problem is that I can not always copy the page, because it is a form: 

<?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;
    
asked by anonymous 08.03.2016 / 20:12

1 answer

1

Using the broswer's own APIs makes it easier to launch the 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>
    
08.03.2016 / 22:21
Uncaught ReferenceError: Ionic is not defined Run Android method when application quits