0

despues de tener problemas para generar el PDF utilizando Firefox para probar el codigo. Genero un pdf utilizando un boton dentro de un formulario. utilizando el siguiente codigo.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>TablaPdf</title>
    <script src="jsPDF-1.3.2/dist/jspdf.min.js"></script>
</head>

<body>
    <form>
        <button onclick="generarPdf(event)">Generar</button>
    </form>
    <script type="text/javascript">
        function generarPdf(evt) {
            evt.preventDefault();
            var pdf = new jsPDF();
            pdf.text(20, 20, "Hola Mundo!");
            pdf.save('mipdf.pdf');
            var pdf = new jsPDF();
            pdf.text(40, 20, "Prueba de texto en pdf");
            pdf.save("Primerpdf.pdf");
        }
    </script>
</body>

</html>

a lo cual da como resultado que cuando doy click en el boton me muestra que se descarga 2 veces el mismo PDF

10
  • ¿Cómo no funciona? ¿Ves algún mensaje en la consola de JS? Intenta concretar el problema un poco más, porque el código compartido funciona perfectamente y sin problemas (como se puede ver en este JSFiddle). El error puede venir de otra parte: quizás no se está agregando bien la biblioteca, quizás el formulario se manda antes de que dé tiempo a generar el PDF... Lee Cómo preguntar y cómo crear un ejemplo mínimo verificable y edita la pregunta con las recomendaciones que encontrarás allí.
    – Alvaro Montoro
    Commented el 9 jul. 2018 a las 21:18
  • @AlvaroMontoro Lo he probado sin mandarlo a llamar por un botón solo que ejecute el script y lo hace perfectamente. Por lo tanto la llamada de la librería esta correctamente, podría ser la otra opción de el formulario se manda antes de que deje generar el PDF..
    – Richard
    Commented el 10 jul. 2018 a las 0:31
  • puedes probar a quitar las etiquetas de form (que realmente no son necesarias para esto, al menos no en el ejemplo de la pregunta) para ver si sigue fallando o no y descartar esa opción.
    – Alvaro Montoro
    Commented el 10 jul. 2018 a las 0:33
  • @AlvaroMontoro Ya lo probé sin la etiqueta form. Y si genera el PDF mi intención es poner un contenido mas grande en PDF utilizando el botón generar, el cual lo utilizare en un proyecto un poco mas grande.. Pero al no funcionar hice pruebas en otro archivo que es este para probar la librería, cambiare la pregunta.
    – Richard
    Commented el 10 jul. 2018 a las 0:39
  • 1
    ¿Has probado a poner event.preventDefault()?
    – Alvaro Montoro
    Commented el 10 jul. 2018 a las 0:54

4 respuestas 4

0

La librería va por la versión 1.4.1, pero aún así cargando la versión 1.3.2 tiene el mismo comportamiento en Chrome y Firefox, aunque Firefox presenta un cuadro de dialogo por cada pdf y Chrome advierte de "multiples descargas"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>TablaPdf</title>
    
</head>

<body>
    <form>
        <button onclick="generarPdf(event)">Generar</button>
    </form>
    <script type="text/javascript">
        function generarPdf(evt) {
            evt.preventDefault();
            var pdf = new jsPDF();
            pdf.text(20, 20, "Hola Mundo!");
            pdf.save('mipdf.pdf');
            var pdf = new jsPDF();
            pdf.text(40, 20, "Prueba de texto en pdf");
            pdf.save("Primerpdf.pdf");
        }
    </script>
</body>

</html>

3
  • Muchas gracias.. pero sigue sin funcionar en Firefox y para mi proyecto nesecito que sea en cualquier navegador. ya que no controlo en que navegador lo usara el usuario Final
    – Richard
    Commented el 10 jul. 2018 a las 3:08
  • cual sería el funcionamiento esperado? no sería mejor empaquetarlos en un .zip ? así es una sola descarga Commented el 10 jul. 2018 a las 10:40
  • Si supongo que si.. Investigare como hacerlo.
    – Richard
    Commented el 10 jul. 2018 a las 12:35
0

Te recomiendo que uses mpdf https://github.com/mpdf/mpdf, librería basada en php desde archivos HTML.

2
  • 1
    hola, es tipo de respuesta no es aceptada por la comunidad, te recomiendo que leas Como responder, esta respuesta podría ser eliminada, no te lo tomes a mal , son las reglas del sitio .Saludos. Commented el 9 jul. 2018 a las 20:29
  • ¿Qué ocurre si el usuario utiliza Java o ASP.Net? La pregunta es sobre HTML y JavaScript (y una biblioteca concreta), las respuestas deberían ajustarse a eso en la medida de lo posible.
    – Alvaro Montoro
    Commented el 9 jul. 2018 a las 21:14
0

Saludos recomiendo revisar que incluyas perfectamente tu libreria, o verificar por consola si existe algun error, dicho esto te muestro el funcionamiento de dicha libreria

un ejemplo basico:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Hello world</title>
</head>
<body>
<input type="button" onclick="miFuncion();" value="Generar PDF">

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script>
    <script type="text/javascript">
      function miFuncion(){
              var pdf = new jsPDF();
          pdf.setFont('courier')
          pdf.setFontType('bolditalic')
          pdf.text(20, 60, 'Este es mi contenido de pdf')
          pdf.save('nombre_pdf.pdf');

      }

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

Para este caso uso un boton al hacer click invoco a una funcion (miFuncion), la cual es la encargada de generar dicho pdf.

Como te decia verifica que estes cargando correctamente tu libreria.

Espero te sirva y ayude... suerte..!!

Verificalo aqui

0

Yo utilizo pdfmake y me ha ido muy bien, te lo recomiendo, es una librería en JavaScript que funciona directamente desde el cliente.

aquí te dejo la documentación

y este es el playground donde puedes ver en código y en tiempo real como funciona.

Espero te sirva, si necesitas ayuda con algo déjame un comentario y te respondo al acto,

Saludos.

1
  • hey bro! apreciamos tu buena intención de responder, te recomiendo que leas Como responder (es.stackoverflow.com/help/how-to-answer), esta respuesta podría ser eliminada por tener solamente enlaces que potencialmente pueden romperse en algún momento. Saludos :D
    – fredyfx
    Commented el 9 jul. 2018 a las 21:18

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.