Call to a member function get_cellmap() on null in barryvdh/laravel-dompdf

Viewed 23

I am using laravel version 9 for doing my project. and there is a feature that needs to let the user export the event ticket. I try to use the package barryvdh/laravel-dompdf . right now I encounter the error of

Call a member function get_cellmap() on null

I tried to read others' posts with a similar issue, but I found out most of them are using the for the view so seems like the solution working for them is not appropriate for me.here is my code :

controller 

 public function GenerateTicket($id)
    {
        $tickets = GiftGivingBeneficiaries::where('gift_giving_id', $id)->get();

        # Retrieve the last batch no. from the gift giving.
        $batch_no = GiftGiving::findOrFail($id)->batch_no;

        GiftGiving::findOrFail($id)->update([
            'last_downloaded_by' => Auth::id(),
            'batch_no' => $batch_no + 1,
        ]);

     
   
       

        $pdf = PDF::loadView('charity.gifts.generate_ticket', compact('tickets'));
        return $pdf->download('event_tickets.pdf');
    }
 


View Page
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <!--  This file has been downloaded from bootdey.com @bootdey on twitter -->
    <!--  All snippets are MIT license http://bootdey.com/license -->
    <title>Genearate Ticket</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
    <link href="https://netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://netdna.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<section class="container">
<h1>Event Tickets</h1>
@foreach ($tickets as $key=> $ticket)

<table>
    
</table>
  <div class="row">

     <input type="hidden"  value="{{$key + 1}} ">

        <article class="card fl-left">
            <section class="date">        
            
            <time datetime="23th feb">
            <span>Ticket No.</span><br>
            <span>{{ $ticket->ticket_no }}</span>
            </time>

            
        </section>
        <section class="card-cont">
            <small>Event Name:{{ $ticket->GiftGiving->name }}</small>
            <h3>{{ $ticket->name }}</h3>
            <div class="even-date">
            <i class="fa fa-calendar"></i>
            <time>
            <span>{{ $ticket->GiftGiving->start_at }}</span>
            
            </time>
            </div>
            <div class="even-info">
            <i class="fa fa-map-marker"></i>
            <p>
                {{ $ticket->GiftGiving->venue }}
            </p>
            </div>
            <a href="#">Batch No.{{ $ticket->GiftGiving->batch_no }}</a>
        </section>
 
        </article>
    

  </div>

  @if ( $key == 5 )
  <div style="page-break-before:always;"> </div>
    @endif
  @endforeach
  
  
 
</div>



<style type="text/css">
    @import url('https://fonts.googleapis.com/css?family=Oswald');
    * {
        margin: 0;
        padding: 0;
        border: 0;
        box-sizing: border-box
    }
    
    body {
        background-color: #dadde6;
        font-family: arial
    }
    
    .fl-left {
        float: left
    }
    
    .fl-right {
        float: right
    }
    
    h1 {
        text-transform: uppercase;
        font-weight: 900;
        border-left: 10px solid #fec500;
        padding-left: 10px;
        margin-bottom: 30px
    }
    
    .row {
        overflow: hidden
    }
    
    .card {
        display: table-row;
        width: 100%;
        background-color: #fff;
        color: #989898;
        margin-bottom:20px;
        font-family: 'Oswald', sans-serif;
        text-transform: uppercase;
        border-radius: 4px;
        position: relative;
        border: #2b2b2b 1px solid;
        
    }
    
    .card+.card {
        margin-left: 2%
    }
    
    .date {
        display: table-cell;
        width: 45%;
        position: relative;
        text-align: center;
        border-right: 2px dashed #dadde6
    }
    
    .date:before,
    .date:after {
        content: "";
        display: block;
        width: 30px;
        height: 30px;
        background-color: #DADDE6;
        position: absolute;
        top: -15px;
        right: -15px;
        z-index: 1;
        border-radius: 50%
    }
    
    .date:after {
        top: auto;
        bottom: -15px
    }
    
    .date time {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
    
    .date time span {
        display: block
    }
    
    .date time span:first-child {
        color: #2b2b2b;
        font-weight: 600;
        font-size: 150%
    }
    
    .date time span:last-child {
        text-transform: uppercase;
        font-weight: 600;
        margin-top: -10px
    }
    
    .card-cont {
        display: table-cell;
        width: 75%;
        font-size: 100%;
        padding: 10px 10px 30px 50px
    }
    
    .card-cont h3 {
        color: #3C3C3C;
        font-size: 130%
    }
    
    .row:last-child .card:last-of-type .card-cont h3 {
        text-decoration: line-through
    }
    
    .card-cont>div {
        display: table-row
    }
    
    .card-cont .even-date i,
    .card-cont .even-info i,
    .card-cont .even-date time,
    .card-cont .even-info p {
        display: table-cell
    }
    
    .card-cont .even-date i,
    .card-cont .even-info i {
        padding: 5% 5% 0 0
    }
    
    .card-cont .even-info p {
        padding: 30px 50px 0 0
    }
    
    .card-cont .even-date time span {
        display: block
    }
    
        .card-cont a {
            display: block;
            text-decoration: none;
            width: 80px;
            height: 30px;
            background-color: #D8DDE0;
            color: #fff;
            text-align: center;
            line-height: 30px;
            border-radius: 2px;
            position: absolute;
            right: 10px;
            bottom: 10px
        }
    
    .row:last-child .card:first-child .card-cont a {
        background-color: #037FDD
    }
    
    .row:last-child .card:last-child .card-cont a {
        background-color: #F8504C
    }
    
    @media screen and (max-width: 860px) {
        .card {
            display: block;
            float: none;
            width: 50%;
            margin-bottom: 10px
        }
        .card+.card {
            margin-left: 0
        }
        .card-cont .even-date,
        .card-cont .even-info {
            font-size: 75%
        }
    }


    .page-break {
    page-break-after: always;
    }
    </style>

<script type="text/javascript">

</script>
</body>
</html>

also, this is what my view looks like. Hope to know what part did I miss for it,every answer is highly appreciated. enter image description here

1 Answers

Not sure if this will help but the way I execute this in my app is like so:

Maybe try storing it first then accessing it? Then delete them after 1 hour?

$pdf = PDF::setOptions(['isHtml5ParserEnabled' => true, 'isRemoteEnabled' => true])->loadView('charity.gifts.generate_ticket', compact('tickets'));
    $pdf->setPaper('a4', 'landscape');
    Storage::disk('reports')->put('tickets'. '.pdf', $pdf->output());
    $url = Storage::disk('reports')->url('tickets'. '.pdf');
Related