Menu
Im using MPDF to output my html form into a PDF. But my problem is, when it converts to PDF the box shape of checkbox is gone, below is the sample how i coded the checkbox
<input type='checkbox' name='opening' value='referal' checked="checked"> Check 1
<input type='checkbox' name='opening' value='referal2' checked="checked"> Check 2
Here's the html output before converting: Here's the html output before converting:
Here's the mpdf OUTPUT: Here's the mpdf output:
As you can see, the check '✓' became dot '.' and the box shape is gone. Is there something wrong with my code? Or It is just not possible with MPDF?
But let me add, if I'm using radio button, all is fine. But what I need is checkbox not radio button. Radio Button OUTPUT:Radio Button
Heres my full code GeneratePDF.php
<?php
include('mpdf60/mpdf.php');
$html .=
"
<!DOCTYPE html>
<html>
<head>
<title>Applicant Information Sheet</title>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'>
<link rel='stylesheet' type='text/css' href='style.css'>
</head>
<body>
<div class=' header-logos text-center'>
<img src='headerimage/logo1.png' width='270' height='90' class=''>
<img src='headerimage/logo2.png' width='170' height='130' class='' >
<img src='headerimage/logo3.png' width='180' height='90' class=''>
</div>
<div class='container top-head'>
<p class='form-hrm'>FORM-HRM-R-003</p>
<hr>
<div class='col-lg-12 col-md-12 col-sm-12 col-xs-12'>
<div class='profile-pic'></div>
<p class='blackened-head'>APPLICANTS INFORMATION SHEET</p>
<form class='head-form'>
<span class='detail1'>Date</span><span class='user-texts'>:</span><span class='user-texts bold'> Nicky Jacobo</span><br>
<span class='detail2'>Position</span><span class='user-texts'>:</span> <span class='choice1 '>1st choice</span><span class='user-texts'>:</span> <span class='user-texts bold'>Information Technology</span><span class='choice2'> 2nd choice</span><span class='user-texts'>: </span><span class='user-texts bold'>Hotel Management</span><br>
<span class='detail3'>Salary Expectation</span><span class='user-texts'>:</span><span class='user-texts bold'>100,000</span><br>
<span class='detail4'>Availability to Start</span><span class='user-texts'>: </span><span class='user-texts bold'>Anytime</span><br>
</form>
<p class='blackened peros'>PERSONAL INFORMATION</p>
</div>
</div><!-- End of top-head -->
<!--==========================================
PERSONAL INFORMATION
============================================= -->
<div class='container personal-information'>
<table>
<tr class='zero-row'>
<th colspan='6' >NAME: <span class='outs'>
<span class='lastname ' style='font-weight: 900;'>JACOBO</span>
<span class='firstname' style='font-weight: 900;'>NICKY</span>
<span class='midname' style='font-weight: 800;'>CABALU</span>
</span><br>
<span class='lastnamedet'>(last name)</span>
<span class='firstnamedet'>(first name)</span>
<span class='midnamedet'>(middle name)</span>
</th>
</tr>
<tr class='first-row'>
<td>NICKNAME<br><span class='user-texts bold'>Nicks</span></td>
<td>BIRTHDATE (mm/dd/yyyy)<br><span class='user-texts bold'>10/25/1994</span></td>
<td>BIRTHPLACE<br><span class='user-texts bold'>Tokyo Japan</span></td>
<td>AGE<br><span class='user-texts bold'>18</span></td>
<td>HEIGHT<br><span class='user-texts bold'>5'7'</span></td>
<td>WEIGHT<br><span class='user-texts bold'>60kg</span></td>
</tr>
<tr class='second-row'>
<td colspan='6'>CITY ADDRESS: <span class='bold'>Plaridel Bulacan</span> </td>
</tr>
<tr class='third-row'>
<td colspan='6'>PROVINCIAL ADDRESS: <span class='bold'>Plaridel Bulacan</span> </td>
</tr>
<tr class='fourth-row'>
<td rowspan='2' ><span class='residentstatus'>RESIDENTIAL STATUS:</span>
<form>
<input type='checkbox' name='gender' value='own' checked='checked'> Own House<br>
<input type='checkbox' name='gender' value='rent'> Rent<br>
<input type='checkbox' name='gender' value='other' > Others (specify): <span class='bold'>Own Mansion</span>
</form>
</td>
<td rowspan='2'><span class='gender'>GENDER:</span>
<form>
<input type='checkbox' name='gender' value='male' checked='checked'> Male<br>
<input type='checkbox' name='gender' value='female' > Female<br>
</form>
</td>
<td colspan='2'>
MOBILE TEL. #: <span class='bold outs'>0926-107-4423</span><br><br>
RESIDENCE TEL. #: <span class='bold outs'>02-25429</span>
</td>
<td colspan='2' >EMAIL ADDRESS:<br><span class='bold outs'>[email protected]</span></td>
</tr>
<tr class='fifth-row'>
<td colspan='4'>CIVIL STATUS:<br>
<input type='checkbox' name='civil-stat' value='single' checked='checked'> Single
<input type='checkbox' name='civil-stat' value='married' > Married
<input type='checkbox' name='civil-stat' value='single-parent' > Single Parent
<input type='checkbox' name='civil-stat' value='widow' > Widow
<input type='checkbox' name='civil-stat' value='other-status'> Others:
<span class='bold'>Complicated</span>
</td>
</tr>
<tr class='sixth-row'>
<td colspan='2' rowspan='2'>Nationality<br><br>
<input type='checkbox' name='filipino' value='filipino' checked='checked'> Filipino<br>
<input type='checkbox' name='othersnationalit' value='female' > Others (specify):
<span class='bold outs'>Alien Gender</span>
</td>
<td colspan='4'>SSS:
<span class='bold'>29-7098-7685-456</span>
       
TIN:
<span class='bold'>29-7098-7685-456</span>
</td>
</tr>
<tr class='seventh-row'>
<td colspan='4'>CURRENT ACTIVITIES:
<span class='bold'>Nandemonai</span>
</td>
</tr>
</table>
<!--==========================================
EMPLOYMENT HISTORY
============================================= -->
<p class='blackened'>EMPLOYMENT HISTORY</p>
<table class='table-two'>
<tr>
<th>COMPANY NAME</th>
<th>LAST POSITION</th>
<th>IMMEDIATE SUPERIOR</th>
<th>CONTACT NUMBER</th>
<th>INCLUSIVE DATES</th>
<th>REASON FOR LEAVING</th>
<th>SALARY</th>
</tr>
<tr class='table2-first-row'>
<td><span class='bold'>iConcept Global</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Supervisor</span></td>
<td><span class='bold'>0926-107-4423</span></td>
<td><span class='bold'>Oct 25 1994</span></td>
<td><span class='bold'>Mayaman na</span></td>
<td><span class='bold'>100,000</span></td>
</tr>
<tr class='table2-first-row'>
<td><span class='bold'>iConcept Global</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Supervisor</span></td>
<td><span class='bold'>0926-107-4423</span></td>
<td><span class='bold'>Oct 25 1994</span></td>
<td><span class='bold'>Mayaman na</span></td>
<td><span class='bold'>100,000</span></td>
</tr>
<tr class='table2-first-row'>
<td><span class='bold'>iConcept Global</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Supervisor</span></td>
<td><span class='bold'>0926-107-4423</span></td>
<td><span class='bold'>Oct 25 1994</span></td>
<td><span class='bold'>Mayaman na</span></td>
<td><span class='bold'>100,000</span></td>
</tr>
<tr class='table2-first-row'>
<td><span class='bold'>iConcept Global</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Supervisor</span></td>
<td><span class='bold'>0926-107-4423</span></td>
<td><span class='bold'>Oct 25 1994</span></td>
<td><span class='bold'>Mayaman na</span></td>
<td><span class='bold'>100,000</span></td>
</tr>
</table>
<!--==========================================
FAMILY BACKGROUND
============================================= -->
<p class='blackened'>FAMILY BACKGROUND</p>
<table class='table-three'>
<tr>
<th></th>
<th>NAME</th>
<th>AGE</th>
<th>OCCUPATION</th>
<th>COMPANY/SCHOOL</th>
</tr>
<tr>
<td>Father</td>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td>Mother</td>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td rowspan='4'>Brothers & Siters</td>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td><span class='bold'>Nicky Jacobo</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td>Spouse</td>
<td><span class='bold'>Not available</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
<tr>
<td>Children</td>
<td><span class='bold'>Not available</span></td>
<td><span class='bold'>18</span></td>
<td><span class='bold'>Web Developer</span></td>
<td><span class='bold'>Secret</span></td>
</tr>
</table>
<!--==========================================
REFERENCES
============================================= -->
<p class='blackened'>REFERENCES</p>
<table class='table-four'>
<tr>
<th>NAME</th>
<th>POSITION</th>
<th>COMPANY</th>
<th>ADDRESS</th>
<th>CONTACT NO.</th>
</tr>
<tr>
<td><span class='bold centerme'>Shana Hirai</span></td>
<td><span class='bold centerme'>Flame Haze</span></td>
<td><span class='bold centerme'>Shakugan no Shana</span></td>
<td><span class='bold centerme'>Anime</span></td>
<td><span class='bold centerme'>0926-107-4423</span></td>
</tr>
<tr>
<td rowspan='9' colspan='3' class='etu'>How did you know of the opening?<br>
<input type='checkbox' name='opening' value='news' checked> Newspaper Ad <br>
<input type='checkbox' name='opening' value='school'> School Placement <br>
<input type='checkbox' name='opening' value='walkin'> Walk-in<br>
<input type='checkbox' name='opening' value='referal' checked> Referral of: <span class='bold outs'>Friend</span> <br>
<input type='checkbox' name='opening' value='other-ads' checked> Others (specify): <span class='bold outs'>Facebook Ads</span><br><br>
</td>
<td rowspan='9' colspan='2'>
<span class='emergency italic'>In case of emergency please contact:</span><br>
Name: <span class='bold'> Sakai Yuji</span><br>
Contact No.: <span class='bold'>0926-107-4423</span><br>
Relation to you: <span class='bold'>Tomodachi</span><br><br>
</td>
</tr>
</table>
<p class='ihereby'>I hereby certify that the above information is true and correct and I hereby authorize Cabalen to verify the said information.</p>
<table class='last-part'>
<tr>
<th><span class=''>   signed already</span><br><br>
<span class='sign-details'> Applicant's Signature</span></th>
<th><span class=''>                          Oct 23 2017</span><br><br>
<span class='date-details'>                          Date</span></th>
</tr>
</table>
</div>
</body>
</html>
";
$mpdf=new mPDF('utf-8', 'Letter', 0, '', 2, 2, 12, 2, 2, 2);
$mpdf->WriteHTML($html);
$mpdf->SetDisplayMode('fullpage');
$mpdf->shrink_tables_to_fit = 1;
$mpdf->Output();
?>
776
The mPDF docs state that the first argument of Output() is the file path, second is the saving mode - you need to set it to 'F'.
$mpdf->Output('filename.pdf','F'); //Only save to File
Updated: You may need this too:
$mpdf->Output('filename.pdf','D');
I already found the cause, its the maxcdn bootstrap link, I only removed the link then everything went fine.
31
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
