Convert my web page content into pdf automatically by adding a button in the end of the page

Question

I want to convert the content of my webpage into pdf and I want this to be made automatically by adding a button at the end of my page.

I found this website (http://www.web2pdfconvert.com/) that gives you some lines of code but it does not work , to be more specific I can add the button but the result is an empty pdf page.

HERE IS THE CODE...

    <html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script> 
$(function(){   
   $('#fileContents').val(document.documentElement.innerHTML);

});
</script>
<style>
div {
    width: 600px;
    border-style: solid;
    border-width: 1px;
}
</style>

</head>
<body>
<form action="download.php" method="post">
<div>
<img src="images/europass_logo.jpg" alt="EUROPASS LOGO" width="100" height="100">

<?php
$dbhost  = 'localhost';    
$dbname  = 'cvtool';       
$dbuser  = 'root';  
$dbpass  = 'smogi';   

mysql_connect($dbhost, $dbuser, $dbpass) or die(mysql_error());
mysql_select_db($dbname) or die(mysql_error());


function queryMysql($query)
{
    $result = mysql_query($query) or die(mysql_error());
     return $result;
}


    $personal_info = queryMysql("SELECT name,email,city,phone FROM personal_information WHERE username='niklakis'");
    $portfolio = queryMysql("SELECT username,portfolio,portfolio_description FROM portfolio WHERE username='niklakis'");
    $work = queryMysql("SELECT job_title,company,website,start_date,end_date,start_year,end_year FROM work WHERE username='niklakis'");
    $education = queryMysql("SELECT school,degree,website,start_date,end_date,start_year,end_year,degree_description FROM education WHERE username='niklakis'");
    $skills = queryMysql("SELECT certification,issuing_authority,start_date,end_date,start_year,end_year,description FROM skills WHERE username='niklakis'");
    $text = queryMysql("SELECT text,section_content FROM text WHERE username='niklakis'");
    if (mysql_num_rows($personal_info)&& mysql_num_rows($portfolio) && mysql_num_rows($work) && mysql_num_rows($education) && mysql_num_rows($skills))
    {
        $row = mysql_fetch_row($personal_info);

        echo "<h2>Personal Information</h2>";
        echo "Full Name: ";
        echo stripslashes($row[0]) . "<br/>Email: ";
        echo stripslashes($row[1]) . "<br clear=left /><br /> City: ";
        echo stripslashes($row[2]) . "<br clear=left /><br />Phone: ";
        echo stripslashes($row[3]) . "<br clear=left /><br />";


        //ALLAGI NA PAIRNEI TO USER P EXEI LOGAREI
        $username = 'niklakis';
        echo "<h2>Education</h2>";
        while($row = mysql_fetch_row($education))
    {
        if($username != $row[0]){
            echo "School: ";
            echo stripslashes($row[0]) . "<br/>Degree: ";
            echo stripslashes($row[1]) . "<br clear=left /><br /> Website: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />Degree Description: ";
            echo stripslashes($row[7]) . "<br clear=left /><br />";
            echo "_________________________<br></br>";
        }
        else
        {
            echo "School: ";
            echo stripslashes($row[0]) . "<br/>Degree: ";
            echo stripslashes($row[1]) . "<br clear=left /><br /> Website: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />Degree Description: ";
            echo stripslashes($row[7]) . "<br clear=left /><br />";
        }
        $username = $row[0];
    }

        //ALLAGI NA PAIRNEI TO USER P EXEI LOGAREI
        $username = 'niklakis';
        echo "<h2>Work Experience</h2>";
         while($row = mysql_fetch_row($work))
    {
        if($username != $row[0]){
            echo "Job Title: ";
            echo stripslashes($row[0]) . "<br/>Company: ";
            echo stripslashes($row[1]) . "<br clear=left /><br /> Website: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />";
            echo "_________________________<br></br>";
        }
        else
        {
            echo "Job Title: ";
            echo stripslashes($row[0]) . "<br/>Company: ";
            echo stripslashes($row[1]) . "<br clear=left /><br /> Website: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />";
        }
        $username = $row[0];
    }


        //ALLAGI NA PAIRNEI TO USER P EXEI LOGAREI
        $username = 'niklakis';
        echo "<h2>Skills</h2>";
        while($row = mysql_fetch_row($skills))
    {
        if($username != $row[0]){
            echo "Certification: ";
            echo stripslashes($row[0]) . "<br/>Issuing Authority: ";
            echo stripslashes($row[1]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />Degree Description: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />";
            echo "_________________________<br></br>";
        }
        else
        {
            echo "Certification: ";
            echo stripslashes($row[0]) . "<br/>Issuing Authority: ";
            echo stripslashes($row[1]) . "<br clear=left /><br />Start Date: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />End Date: ";
            echo stripslashes($row[3]) . "<br clear=left /><br />Start Year: ";
            echo stripslashes($row[4]) . "<br clear=left /><br />End Year: ";
            echo stripslashes($row[5]) . "<br clear=left /><br />Degree Description: ";
            echo stripslashes($row[6]) . "<br clear=left /><br />";
        }
        $username = $row[0];
    }



        //ALLAGI NA PAIRNEI TO USER P EXEI LOGAREI
        $username = 'niklakis';
        echo "<h2>Portfolio</h2>";
    while($row = mysql_fetch_row($portfolio))
    {

        if($username != $row[0]){
            echo "Portfolio: ";
            echo stripslashes($row[1]) . "<br/>Portfolio Description: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />";
            echo "_________________________<br></br>";
        }
        else
        {
            echo "Portfolio: ";
            echo stripslashes($row[1]) . "<br/>Portfolio Description: ";
            echo stripslashes($row[2]) . "<br clear=left /><br />";         
        }
        $username = $row[0];
    }



        $row = mysql_fetch_row($text);
        echo "<h2>Text</h2>";
        echo "Text Title: ";
        echo stripslashes($row[0]) . "<br/>Content: ";
        echo stripslashes($row[1]) . "<br clear=left /><br />";

    }



?>
</div>
<input type="submit" id="createPdf" value="Download PDF"/>
</form>
</body>
</html>

AND I GET THIS ERROR ... (Can't access your local URL: http://localhost/industrial/CVTool/test.php)

It would be most helpful if you could be a touch more specific. If you would like help with your code that does not work, could we perhaps see it, and have more explanations as to exactly how it does not work? — halfer, Jan 11 '15 at 01:11
My code is just MySQL queries that displays some results. I just want to add a button on the bottom of my page that converts the web page into a pdf page. — Waaaaat, Jan 11 '15 at 01:13
Alright, so would you edit your question to show us what isn't working? At the moment we have nothing to go on. — halfer, Jan 11 '15 at 01:20
Excellent! Please write all your questions like that: statement of problem, code being used. Much more answerable. — halfer, Jan 11 '15 at 09:37

score 5 · Accepted Answer · edited Jan 11 '15 at 09:35

The easiest way I have found to do this is to use mPDF. Note that to do this, you'll need to use PHP. You don't need to understand PHP, your file just has to be hosted on a server that has access to PHP (ie the file won't work when run from localhost, at least not without PHP).

If you are hosting the site yourself under localhost you'll need to install php. There is a nice guide available here. I believe you'd only need to do steps 1-3. Step 4 is MySQL which is for database interaction. You wont need that and I don't believe it is required.

Basically when your page loads, you use jQuery to get all of the HTML and add it to a hidden form input. When the user clicks the button you submit the form to a PHP page that creates a PDF page with the HTML and downloads the page. Pretty simple actually, mPDF does all the heavy lifting.

Here is a working example. Here is a zip file with all of the files used in my example.

Take the mpdf folder and the download.php file and drop them into the folder with your HTML file. Then change the head of your HTML like this:

<script> 
 $(function(){  
     $('#fileContents').val( document.documentElement.innerHTML);
     $('#pdfForm').append('<input type="submit"  value="Download PDF" />');
 });

</script>


....
</head>

Then later at the bottom of your html like this:

   </div>
     <form id="pdfForm" action="download.php" method="post">

            <div style="display:none;" >
              <input type="text" name="fileContents" id="fileContents" value=''/>
              <input type="text" name="fileName" id="fileName" value='mySitePage.pdf'/>
              <input type="text" name="css" value='style.css'/>

            </div>
   </form> 
  </body>
</html>

Hello my friend again! :P , can you help me with this problem http://stackoverflow.com/questions/27905459/edit-form-cannt-get-the-next-data-for-the-same-user — Waaaaat, Jan 13 '15 at 00:52

Convert my web page content into pdf automatically by adding a button in the end of the page

1 Answers1