dompdf page breakes not working - php

here is sample image
<!DOCTYPE html>
<html class="bg-black">
<head>
<meta charset="UTF-8">
<title><?php if(isset($title)) echo $title.' | '; ?> Sales agent management software (SAMS) </title>
<style>
body{
font-size: 9px;
margin: 20px;
}
th,td,p,div,table,h3{margin:0;padding:0}
#page { margin: 20px; }
.header{
border-bottom: 1px solid #dddddd;
text-align: center;
position: fixed; top: 0;
}
.footer { position: fixed; bottom: 0px; text-align: center }
.pagenum:before { content: counter(page); }
</style>
</head>
<body>
<div class="header">
<h2><?php echo get_option('company_name'); ?> Catalog</h2>
</div>
<br /><br />
<div class="footer">Page: <span class="pagenum"></span>, creation time : <?php echo date('l jS \of F Y h:i:s A') ?>, create by: <?php echo user_full_name(singleDbTableRow(loggedInUserData()['user_id'])); ?></div>
<br />
<div class="box-body">
<?php
$usd = get_option('lkr_per_usd', 134);
?>
<?php
$result = array_chunk($products->result_array(), 3);
foreach($result as $products){ ?>
<table style="width:100% style="page-break-after:always;" >
<tr>
<?php
foreach($products as $productArray){
$product = (object) $productArray;
echo '<td>';
?>
<div style="width: 100%; height: 210px; border: 1px solid #dddddd; margin: 10px; padding: 5px;">
<div class="box-header">
<p class="box-title"><FONT SIZE=12><?php echo $product->product_name; ?></FONT></p>
</div>
<div style="height: 80px; text-align: center;">
<?php echo '<img src="'.'uploads/'. $product->photo.'" class="img-responsive" style="height:80px !important; width: 150px !important" />'; ?>
</div>
<div style="clear: both"></div>
<table class="table table-responsive">
<tr>
<th><FONT SIZE=12>ID</FONT></th>
<td><FONT SIZE=14><?php echo $product->product_id; ?></FONT></td>
</tr>
<tr>
<th><FONT SIZE=12>LKR</FONT></th>
<td><FONT SIZE=14><?php $lkr = get_selling_price($product);
echo number_format(round($lkr, get_option('round_precision')) ); ?></FONT>
</td>
</tr>
<tr>
<th> <FONT SIZE=12>US $</FONT></th>
<td><FONT SIZE=14><?php echo number_format(round(lkr_to_usd($lkr), get_option('round_precision')) ); ?></FONT></td>
</tr>
</table>
</div>
</td>
<?php } ?>
</tr>
<?php } ?>
</table>
</div><!-- /.box-body -->
</body>
</body>
</html>
when i try to generate pdf it's always coming like this. i added my generate pdf code above .
2 nd page is not coming like 1st page.. i searched and found other dompdf solution for other peoples problem. but my problem is on 2nd page it's not coming as 1stpage.

There's some buggy behavior here on the part of dompdf. For some reason styling the DIV containing your product info with width: 100% is breaking the layout when the table row is paged. If you remove that styling from the DIV then the document should render as expected. The default DIV layout is full-width so you can leave the width styling on the DIV out

Related

I added function to sort pics according to price they appeared in abnormal size

[enter image description here][1]
[1]: below is the code of sort by button i don't know why this happens while this is not the actually dimensions of the photos
https://i.stack.imgur.com/qxTt1.jpg
<center>
<table>
<?php
$opt=$_POST['sorting'];
if ($opt=="low") {
$qy="SELECT * FROM `men` order by `price` ASC";
$rt=mysqli_query($con,$qy);
while ($row1=mysqli_fetch_array($rt)) {
?>
<tr style="text-align: center; display: inline;">
<td style="border: thin solid lightgrey; width: 300px;
height: 200px;">
<pre>
<img src="<?php echo $row1['img']; ?>">
<b> <?php echo $row1['name']; ?> </b>
<span style="color: blue; font-weight: bold;">
<?php echo $row1['price']; ?>
</span>
</pre>
</td>
</tr>
<?php
}
}
else {
$qy="SELECT * FROM `men` order by `price` DESC";
$tt=mysqli_query($con,$qy);
while ($row1=mysqli_fetch_array($tt)) {
?>
<tr style="text-align: center; display: inline;">
<td style="border: thin solid lightgrey; width: 300px;
height: 300px;">
<pre>
<img src="<?php echo $row1 ['img']; ?>">
<b> <?php echo $row1['name']; ?></b>
<span style="color: blue; font-weight: bold;">
<?php echo $row1['price']; ?>
</span>
</pre>
</td>
</tr>
<?php
}
}
?>
</table>
</center>
<?php
}
?>

Download PDF using php with logo always on top of each page

I have this code to display on the page, however I also want to give users the option to download PDF , but on top of each PDF page I want there to be a logo picture, how can I do this? Is there a way with datatables? or just plain code?
<table>
<?php
foreach($sheets as $s):
echo "<tr>";
echo "<td>";
$name= explode(' ',$s['customer_name'])
?>
<div style="text-align: center">
<img alt="" src="/adminpanel2/public/logo.png">
</div>
<h2 style="text-align: center">Hi <?php echo $name[0] ?>!</h2>
<div align="center">
<br> Here is your delivery for: <br>
<?php echo date('l, F dS', strtotime($s['delivery_week']));?>
<br>
ORDER NO. <?php echo $s['order_id'] ?> | CUSTOMER NO.<?php echo $s['client_id'] ?>
<hr style="height: 5px;border-top:1px solid #000 !important;margin-bottom:0px">
<hr style="height: 5px;border-top:1px solid #000 !important;margin-top: 5px !important;">
</div>
<?php foreach($s['meals'] as $m):?>
<h3><?php echo $m['display_name'];?> </h3>
<?php echo $m['count']?> SERVING SHIPPED<br><br>
COMPONENTS
<hr align = "left" style="width: 115px; border-top:1px solid #000 !important;margin-top: 5px !important;margin-bottom:0px">
<br>
<?php foreach($m['components'] as $c):?>
<?php echo $c?><br>
<?php endforeach;?>
<hr align="left" style="width: 400px; border-top:1px solid #000 !important;margin-top: 5px !important;margin-bottom:0px" >
<?php endforeach;?>
<hr align="left" style="width: 600px; border-top:1px solid #000 !important;margin-top: 5px !important;margin-bottom:0px" >
<div align="center"><h3> Thank you,<?php echo $name[0] ?>!</h3>
<hr style="width: 600px; border-top:1px solid #000 !important;margin-top: 5px !important;margin-bottom:0px" >
</div>
<br>
<br>
<br>
<br>
<br>
</td>
</tr>
<?php endforeach; ?>
</table>
Here is my code (above) I am using php fuel

How to fix the value from php to use bootstrap?

I am using bootstrap accordion style to show the list of speakers in our website.
For that, I have a list of speakers table in my database. And I am getting the fields using php. In the following way.
<?php
global $wpdb;
$result = $wpdb->get_results( "SELECT * FROM `Invited_Speakers`");
foreach ( $result as $print ) { ?>
<tr style="width:100%">
<div class="maindrop" style="float: left; text-align: justify;">
<a class="bar" style="text-decoration: none;" href="#<?php echo $print->Last_Name;?>"> <?php echo $print->First_Name; ?> <?php echo $print->Last_Name; ?>, <?php echo $print->Institue_Address; ?>
</a>
<div id="<?php echo $print->Last_Name;?>" class="dropbox">
<img style="border-radius: 10%; padding: 10px; float: left;" src="<?php echo $print->Image_link;?>" alt="" width="20%" align="left" />
<table style="width:79%;float: right;">
<tbody>
<td > <?php echo $print->Designation;?> </td>
</tr>
<tr>
<td ><?php echo $print->Department_Address;?></td>
</tr>
<tr>
<td> Email Id: <?php echo $print->Email_Id;?></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td >Research Interests</td>
<td>:</td>
<td> <?php echo $print->Research_Interests;?> </td>
</tr>
<tr>
<td>
Achievements
</td>
<td> : </td>
<td><?php echo $print->Acheivements;?>
<button style="float:right;"><a style="color: white;" href="<?php echo $print->Home_page_Link;?>" target="_blank" rel="noopener"> More Info </a> </button>
</td>
</tr>
</tbody>
</table>
</div>
<?php }
?>
It has given me as expected, but the problem is,
when I click the bar, it should show me the dropbox which contains the details of the speaker. But it is not showing.
It seems like the link is not available.
How to rectify this??
I have around 60 speakers and for everybody, writing html code manually does not sound like good idea.
Link of the page is given here: Click here
In the above link, the problem is with the invited speakers list.
Thanks in advance
CSS:
.maindrop {
width: 100%;
}
.bar {
padding: 0px;
display: block;
border-bottom:1px solid #06394D;
text-decoration: none;
font-family: "Times New Roman", Times, serif;
font-size: 18px;
font-weight:300;
transition: .5s ease-out;
}
.bar:hover {
background: #F6F7F7;
padding: 15px;
text-decoration: none;
}
.dropbox {
max-height: 0;
transition: .2s ease-out;
overflow: hidden;
width: 100%;
}
.dropbox:target {
max-height: 5000px;
}
Assuming you're using Bootstrap 3, '.dropbox' does not exist as a class. What I believe you're looking for is an Accordion, which can be found under the Collapse documentation section.
Here is a little sample that should get you started in the right direction. The $count is there to make sure each row has a unique identifier to open it's associated accordion. I simplified the markup from which you have but you should be fine replacing with what you need.
<table style="width:100%">
<?php
$count = 0;
foreach($result as $print): ?>
<tr data-toggle="collapse" href="#collapseExample-<?php echo $count; ?>" aria-expanded="false" aria-controls="collapseExample-<?php echo $count; ?>">
<td>Speaker Name</td>
<td>Speaker Description</td>
</tr>
<tr class="collapse" id="collapseExample-<?php echo $count?>">
<td>This should be hidden</td>
</tr>
<?php $count++; endforeach; ?>
</table>

How to create style of html elements while php codes are embedded in it?

I have this php file where I want to retrieve data from database and show in a tabular format.
<html>
<head>
<title>Admin</title>
<link rel="stylesheet" type="text/css" href="adminPanel.css"/>
</head>
<body>
<div class="header">
<h1>Admin</h1>
</div>
<div class="center">
<?php
include "db_connection.php";
$sql = "SELECT * FROM appointments;";
$result = mysqli_query($db,$sql);
If(mysqli_query($db,$sql) == TRUE){
?>
<table>
<th>Name</th>
<th>Address</th>
<th>Phone</th>
<th>License</th>
<th>Engine</th>
<th>Appointment Date</th>
<th>Preferred Mechanic</th>
<?php
while($row = mysqli_fetch_assoc($result)){
?>
<td><?php echo $row['Name'];?></td></br>
<td><?php echo $row['Address'];?></td>
<td><?php echo $row['Phone'];?></td>
<td><?php echo $row['Car_license_No'];?></td>
<td><?php echo $row['Car_Engine_No'];?></td>
<td><?php echo $row['Date'];?></td>
<td><?php echo $row['Mechanic'];?></td>
<?php
}
?>
</table>
<?php
}
?>
</div>
<div class="footer">
<p id="lastMod">
<script language="Javascript">
document.write("Last modified on " + document.lastModified + " ");
</script>
</p>
</div>
</body>
</html>
But the problem is I can`t change the style of data showing in the table. The .footer, .center, .header these are showing up with the perfect style. But styles of html elements that are written within the php blocks are not working, such as , , .
Here is my style sheet
.header{
background-color: black;
color: DC143C;
height: 150px;
margin-bottom: 0px;
font-family: "Impact"
}
.center{
background-image: url(background.jpg);
height: 400px;
margin-top: 0px;
margin-bottom: 0px;
}
.footer{
background-color: black;
font-family: "Impact";
color: DC143C;
margin-top: 82px;
height: 95px;
}
th, td{
color: white;
}
#lastMod{
margin-top: 0px;
padding: 5px;
}
Searched a lot but havn`t found any relevant answer. Thanks in advance.
You should apply the classes to cells then you could style it.
<td class="name"><?php echo $row['Name'];?></td></br>
...
<td class="mechanic"><?php echo $row['Mechanic'];?></td>
<style>
td.name {
background-color: #0f0;
}
....
td.mechanic {
background-color: #f00;
}
</style>
you didn't added any class in your php you should add class in your table like
<table class="mytable">
and style it by pointing with parent such as
<style>
.mytable th { color:#fff; }
</style>

how to add scrollbar in fixed container

I want to add scrollbar in a fixed container of cart products so that when I will add too many products in cart, I can view it easily by scrolling down the products in the container
Here is the HTML code of the container
?>
<div class="right_nav" >
<div class="right_nav_top">
Your Cart
</div>
<hr width="130px">
<table width="167" border="0" cellpadding="0" cellspacing="0" style="font-size:12px; margin:5px; overflow:auto">
<?php
//iterate through the cart, the $product_id is the key and $quantity is the value
foreach($_SESSION['cart'] as $product_id => $quantity) {
//get the name, description and price from the database -
//this will depend on your database implementation.
//use sprintf to make sure that $product_id is inserted into the query as a number -
//to prevent SQL injection
$sql = sprintf("SELECT
event_title,
event_desc,
price
FROM events
WHERE id = %d;",
$product_id);
$result = mysql_query($sql);
//Only display the row if there is a product
//(though there should always be as we have already checked)
if(mysql_num_rows($result) > 0) {
list($name, $description, $price) = mysql_fetch_row($result);
$line_cost = $price * $quantity; //work out the line cost
$totals = $total + $line_cost; //add to the total cost
?>
<tr>
<td colspan="3"><?php echo $name;?></td>
</tr>
<tr>
<td width="31"><?php echo $quantity;?>x</td>
<td width="59">&pound<?php echo $line_cost?></td>
<td width="70">
<a href="<?php Site_titte();?>/viewcart.php?action=add&id=<?php echo $product_id;?>" title="Add">
<img src="<?php Site_titte();?>/images/addred.png" width="24" height="24" border="none">
</a>
<a href="<?php Site_titte();?>/viewcart.php?action=remove&id=<?php echo $product_id;?>" title="Remove">
<img style="margin-bottom:6px;" src="<?php Site_titte();?>/images/icon_close.png" border="none"></a></td>
</tr>
<?php }}?>
</table>
<?php
if(!isset($_SESSION['uid']))
{$link="login.php";}
else
{$link=Site_titte()."/order.php";}
?>
<hr width="130px">
<div class="total_main">
<div class="total_p1">Total</div>
<div class="total_p2">&pound<?php echo $total ?></div>
<div class="clearfix"></div>
</div>
<br>
<center>
<a href="<?php echo $link;?>">
<img src="<?php Site_titte();?>/images/btn_order.png" border="none" width="140" height="38">
</a>
</center>
</div>
<?php
}
else {
?>
<div class="right_nav2">
<div class="right_nav_top2">
Your Cart
</div>
<hr width="130px">
<table border="0" cellpadding="0" cellspacing="5" style="font-size:14px; margin:5px;">
<tr>
<td colspan="3">Your cart is empty.</td>
</tr>
</table>
and this is the css code
.right_nav2{
position: fixed;
bottom: 0px;
right: 0;
top:220px;
margin: 0 10px 10px 0;
border: #DBDBDB 1px solid;
border-radius: 5px;
background-color:#fff;
height:150px;
width:150px; }
.right_nav_top2{
position:relative;
background:url(images/icon_cart_small.png) right no-repeat;
color:#214200;
margin: 12px;
font-size: 19px; }
.right_nav{
position: fixed;
right: 0;
top:220px;
border: #DBDBDB 1px solid;
border-radius: 5px;
background-color:#fff;
style="max-height: 552px;;
width:150px; }
.right_nav_top{
position:relative;
background:url(images/icon_cart_small.png) right no-repeat;
color:#214200;
margin: 12px;
font-size: 19px;}
.total_main{
position:relative;
background:#dbdbdb;
font-size: 14px;}
.total_p1{
position:relative;
float:left;
margin: 5px 11px 5px 12px;}
.total_p2{
position:relative;
float:left;
margin: 5px 11px 5px 0px;}
Please help me where should I edit to add a scrollbar in this container
You can add overflow-y or overflow-x to achieve this depending on which direction you want to scroll. I'm guessing you want to scroll up and down. So when your div increases in content (products) past it's limits, a scroll bar will appear for the div. See the example below:
Example:
<!-- Scroll bar present but disabled -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
test
</div>
<!-- Scroll bar present and enabled -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
test<br />
</div>
add
overflow:scroll
to the to the element you want to have the scroll bar.

Categories