Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

426
Visualizações
QR CODE not showing when printing JavaScript

I have a Qr code which i want to print. Qr code is showing fine in the page but when i try to print it it's not showing.

in home page - enter image description here

in print page -

enter image description here

Html

<div class="container" id="printarea">
        <div class="card"style="height: 386px;">
          <div class="card-body">
            <center>
             <div id="qrcode"></div>
             <br>
              <br>
              <br>
              <br>
              <br>
              <br>
              <br>
            Powered by <img src="{{env('APP_URL')}}/public/{{$app_setting->webLogo}}" class="logo-icon" alt="logo icon" style="width:40px;">
            </center>
          </div>
        </div>
      </div>

JQuery Qr Code

<script>
 var qrcode1 = "{{Auth::guard('vendor')->user()->VendorURL}}";
 jQuery(function(){
    jQuery('#qrcode').qrcode(qrcode1);
 })
</script>

Qr code printing code

function printFunc() {
var divToPrint = document.getElementById('printarea');
var htmlToPrint = '' +
    '<style type="text/css">' +
    'table th, table td {' +
    'border:1px solid #000;' +
    'padding;0.5em;' +
    '}' +
    '</style>';
htmlToPrint += divToPrint.innerHTML;
newWin = window.open("");
newWin.document.write("<h3 align='center'>QR Code</h3>");
newWin.document.write(htmlToPrint);
newWin.print();
newWin.close();
about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

I have get this Solution - Converting the QR Code to an Image

var canvas = $('#qrcode canvas');
var img = canvas.get(0).toDataURL("image/png");
newWin = window.open("");
var ig = '<p style="text-align: center;">Powered by <img src="{{env('APP_URL')}}/public/{{$app_setting->webLogo}}" class="logo-icon" alt="logo icon" style="width:40px;"></p>';
newWin.document.write("<h3 align='center'>QR Code</h3>");
newWin.document.write('<img style="display: block; margin: 0 auto;" src="'+img+'"/>');
newWin.document.write(ig);
setTimeout(function() {
newWin.print();
newWin.close();
}, 250);
}
about 4 years ago · Juan Pablo Isaza Relatório

0

Just Enable Background Graphics from print preview page, Click on more settings you can see it

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda