Call to the function printTable does not work on the label a

Question

The call to the printTable function does not work on the a tag, I add it through onclick (); am I coding wrong?, what would my mistake be. Could you please help me to identify where I am failing

<a title='Imprimir' data-toggle="tooltip"  class='waves-effect waves-light' id="boton"><i class='fa fa-print'></i></a>

Here you should open a pdf

<script>
     
 $(document).ready(function() {
      $("#boton").click(function() {
        var cliente= $('#NombreCliente').text();
        var capitalp=$(this).parents("tr").find("td")[5].innerHTML;
        var abono=$(this).parents("tr").find("td")[4].innerHTML;
        var totalPago = $(this).parents("tr").find("td")[1].innerHTML;
        var iva = $(this).parents("tr").find("td")[2].innerHTML;
        var interes = $(this).parents("tr").find("td")[3].innerHTML;

        var HTML ="<div style='position: relative; '><img src='<?= base_url() ?>plantilla/images/logo' style='position: absolute; background-size: 100% 100%; filter:alpha(opacity=25); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5); opacity:.25; left:100px; top: -10px;'></div>";
         HTML+="<img src='<?= base_url()?>plantilla/images/logo.png'  width='100'><div class='row text-center'><h1>PRESTAMAS DINERO AL INSTANTE S.A.</h1> </p><p>Comprobante de pago</p></div>";
        HTML+= '<table  class="table table-bordered">';
          HTML+= '<tr class="tr tr1">';
            HTML+= '<td><strong>Cliente</strong> </td>';
           HTML+= ' <td>'+cliente+'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
            HTML+= '<td><strong>Por</strong> </td>';
            HTML+= '<td>'+totalPago+'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
            HTML+= '<td><strong>Abono capital</strong> </td>';
            HTML+= '<td> '+abono+'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
            HTML+= '<td><strong>Intereses</strong> </td>';
           HTML+= '<td>'+interes +'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
           HTML+= '<td><strong>Iva</strong> </td>';
            HTML+= '<td>'+iva +'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
           HTML+= '<td><strong>Capital pendiente</strong> </td>';
            HTML+= '<td>'+capitalp +'</td>';
          HTML+= '</tr>';
          HTML+= '<tr class="tr tr1">';
           HTML+= '<td colspan="2" style="font-size:12px;" align="center"><strong>CON SU ESFUERZO Y NUESTRO APOYO PROSPERARÁ SU NEGOCIO</strong> </td>';
          HTML+= '</tr>';
        HTML+= '</table>';
        var pantalla=window.open(' ','popimpr');
        pantalla.document.write('<link href="<?= base_url() ?>plantilla/css/bootstrap.min.css" rel="stylesheet" />');
        pantalla.document.write(HTML+"<p>Contabilidad</p><br>"+HTML+"<p>Cliente</p>");
        pantalla.document.close();
        self.location ="<?= base_url()?>Creditos";
      pantalla.focus();
      pantalla.onload = function() {
        pantalla.print();
        pantalla.close();
      };
       //$(".ocultarImprimir").show();
        });
    });
</script>

Here you should open a pdf window

Marco Rapaccini · Answer 1 · 2021-07-08T23:22:09.383

The <a> tag generally has a default behaviour when you click on it.

Following this answer, try to add an href="#":

<a title='Imprimir' data-toggle="tooltip" onclick="imprimirTabla()" class='waves-effect waves-light ver boton' href="#"><i class='fa fa-print'></i></a>

Or you could try to add a return inside the onclick:

<a title='Imprimir' data-toggle="tooltip" onclick="return imprimirTabla();" class='waves-effect waves-light ver boton'><i class='fa fa-print'></i></a>

Or try to add the onclick event to the print <i> icon:

<a title='Imprimir' data-toggle="tooltip" class='waves-effect waves-light ver boton' href="#"><i class='fa fa-print' onclick="imprimirTabla()"></i></a>

Please [edit] your answer and write a brief summary of the content of the link you provide. Remember that such content may no longer be available at later. Read [answer]. — padaleiana, Jul 08 '21 at 23:11

score 0 · Answer 2 · answered Jul 12 '21 at 04:54

my mistake was not declaring in the tag id = "boton"

<a title='Imprimir' data-toggle="tooltip" class='waves-effect waves-light' id="boton"><i class='fa fa-print'></i>Imprimir</a>

$(document).ready(function() {
      $("#boton").click(function() {
        var cliente= $('#NombreCliente').text();
        var capitalp=$(this).parents("tr").find("td")[5].innerHTML;
        var abono=$(this).parents("tr").find("td")[4].innerHTML;
        var totalPago = $(this).parents("tr").find("td")[1].innerHTML;
        var iva = $(this).parents("tr").find("td")[2].innerHTML;
        var interes = $(this).parents("tr").find("td")[3].innerHTML;

Call to the function printTable does not work on the label a

2 Answers2