Como gerar pdf com conteúdo HTML com JavaScript e jspdf

Поделиться
HTML-код
  • Опубликовано: 3 фев 2025

Комментарии • 35

  • @greisonrocha3801
    @greisonrocha3801 Год назад +1

    Muito bom, gosto muito da sua didática de ensino. Obrigado Celke, vale muito mesmo suas aulas.

  • @franklindkl
    @franklindkl 2 года назад +1

    Alem de explicar muito bem ainda disponibiliza o arquivo...
    Obrigado e sucesso para vc!
    +1 Inscrito

  • @felipeassumpcao3039
    @felipeassumpcao3039 2 года назад +1

    Maravilha como sempre! estou gostando muito dessas aulas com a linguagem pura continua.

  • @greisonrocha3801
    @greisonrocha3801 Год назад +1

    Quando eu codifiquei a primeira vez usei a versão 5.1 e não funcionou, depois observei que o seu usava 1.4.1, logo funcionou bem. Mas uma vez obrigado.
    Quero poder fazer este curso.

  • @digoferon
    @digoferon 2 года назад +1

    Sempre ótimas aulas Cesar .... Sucesso ...🤩😍

  • @romuloalves9349
    @romuloalves9349 2 года назад +1

    Ótima vídeo aula parabéns 👏.

  • @denisquintasluiz506
    @denisquintasluiz506 2 года назад +1

    Muito legal 🙏✅👏👏

  • @fabricioitajuba
    @fabricioitajuba 10 месяцев назад

    Muito bom!!!! parabéns!!!

  • @cristianphd
    @cristianphd 2 года назад +1

    Top!!

  • @cidicleycintra
    @cidicleycintra 2 года назад +1

    Não consegui acrescentar nenhum estilo CSS, também tentei colocar uma tabela em uma variavel php e passar os valores e também deu erro. só converte texto simples sem estilos e sem tags especiais?

  • @luzautomacao2625
    @luzautomacao2625 2 года назад +1

    como implementar isso para exportar a minha página html inteira?

  • @XXXXalexandre
    @XXXXalexandre 2 года назад +1

    Quando possivel faz um video, criando uma estilização no pdf. Abraços!

    • @celkecursos
      @celkecursos  2 года назад

      Olá Alexandre,
      Obrigado pela sugestão.
      Seguindo o tutorial dá para acrescentar o CSS, por exemplo: doc.fromHTML('Gerar PDF com conteúdo HTML', 15, 15);

  • @elenadomingos7632
    @elenadomingos7632 11 месяцев назад

    E como eu posso fazer isso numa página espicifica. Eu tentei este jeito, mas ele colocar o html na primeira página por cima do que já tenho lá. Preciso que este conteúdo do html passa na décima página.

  • @NiltonOliv
    @NiltonOliv Год назад

    Gero o pdf da página com o framework do bootstrap usando , porém é mostrado os botões da "ação".
    Gostaria de ocultar estes botões do print. Coloquei o style="dispaly: none", mas continua o mesmo.

  • @topnacional
    @topnacional 2 года назад +5

    Cesar ensina nós estilizar esse pdf com CSS por favor 😍

    • @celkecursos
      @celkecursos  2 года назад +1

      Olá Top Nacional,
      Seguindo o tutorial dá para acrescentar o CSS, por exemplo: doc.fromHTML('Gerar PDF com conteúdo HTML', 15, 15);

  • @severinojoaquim
    @severinojoaquim Год назад

    Esses scripts funcionam para aplicações em PHP?

  • @dcernach
    @dcernach 2 года назад

    Caraca, muito útil, mas onde é que tá a documentação desse método? Nem esse método encontrei no site oficial de documentação da biblioteca!

  • @gabepell2894
    @gabepell2894 2 года назад +2

    Celke, tem como gerar o PDF a partir do conteúdo de uma div? Sem precisar escrever todo conteúdo dentro da tag javascript, apenas selecionando o ID/Class da div no JS e todo conteúdo dentro dessa div selecionada será impresso no PDF, incluindo a estilização CSS, é possível?

    • @RodrigoSilva-xw8ly
      @RodrigoSilva-xw8ly 2 года назад

      Olá, creio que passando como parâmetro o elemento da sua DOM que deseja gerar o pdf em doc.fromHTML(document.querySelector("#meuhtml").innerHTML)

    • @celkecursos
      @celkecursos  2 года назад

      Olá GabePell,
      Segue o exemplo como recuperar o valor da com JavaScript.
      Celke
      Conteúdo da div
      // Função para recuperar o valor da DIV com JavaScript
      function recuperarValorDiv() {
      // Recuperar a DIV "conteudo" o texto
      var conteudoRecuperado = document.getElementsByClassName("conteudo")[0].innerText;
      // Imprimir na tela, mas o conteúdo que está dentro da variável "conteudoRecuperado" pode ser utilizado para qualquer outra funcionalidade
      document.write(conteudoRecuperado);
      }
      // Chamar a função quando carregar a página
      recuperarValorDiv();

  • @Leo_Russo
    @Leo_Russo Год назад

    Show de bola!
    Pq a minha instância mostra a propriedade .html mas não .fromHTML?

    • @SherlianeBatista
      @SherlianeBatista Год назад +1

      Oie vc conseguiu?

    • @Leo_Russo
      @Leo_Russo Год назад

      @@SherlianeBatista parece que é um plug-in ou outra lib além dessa. No meu caso eu não tava usando CDN igual do vídeo, instalei local.

  • @luzautomacao2625
    @luzautomacao2625 2 года назад

    Aqui pra mim não funcionou, tem que baixar alguma coisa?

  • @marcosalbertt
    @marcosalbertt 9 месяцев назад

    Eu tenho uma página em HTML consegui fazer os códigos para gerar o PDF mas quando insiro uma imagem não sai no PDF

    • @AnimaOnn
      @AnimaOnn 6 месяцев назад

      Fala meu mano, tenta transformar a imagem em base64

    • @AguimarAlvesSP
      @AguimarAlvesSP Месяц назад

      Sei que já faz tempo e deve ter conseguido, mas para incluir uma imagem(uso PNG), faço assim:
      let image = new image();
      image.src = '/caminhoDaImagem/imagem.png';
      Na função jsPDF()
      //Exemplo
      doc.addImage(image, 'PNG', 14, 5, 30, 18) - Neste exemplo adiciono uma imagem PNG, com 14mm da borda esquerda do PDF e 5mm da borda superior e com largura de 30mm e altura de 18mm.

  • @marcosatsantana
    @marcosatsantana 2 года назад +1

    Consigo adicionar css?

    • @celkecursos
      @celkecursos  2 года назад +1

      Olá Marcos,
      Segue o link do tutorial que apresento com gerar PDF com conteúdo HTML: ruclips.net/video/517xYbBApSA/видео.html
      Seguindo o tutorial dá acrescentar o CSS, por exemplo: doc.fromHTML('Gerar PDF com conteúdo HTML', 15, 15);

  • @analucia6899
    @analucia6899 2 года назад

    I cracked soft soft today

  • @pauloocarrilhoo5522
    @pauloocarrilhoo5522 2 года назад +1

    Olá, é possível chamar uma variável dentro desse h1 ?
    Estou criando um pdf com dados variados e fiz do corpo do pdf dentro do HTML, e criei uma variável que recebe o id da minha div
    ( ex: let conteudo = document.getElementById("pagina1") )
    então chamo no meu fromHTML assim:
    const pagina1 = () => {
    doc.fromHTML(conteudo, 20, 40, { width: 80 });
    };
    Isso está funcionando normal, porém eu não consigo deixar o texto justificado,
    na minha tela de vizualização do HTML o funciona e mostra o texto justificado, mas quando eu gero o pdf ele não justifica..
    tentei também usar: doc.fromHTML(conteudo, 20, 40, { width: 80, align: "justify" }) e também não funcionou..
    Sabe dizer como eu poderia fazer ?

    • @celkecursos
      @celkecursos  2 года назад

      Olá Paulo,
      Segue o link do tutorial como gerar PDF com JavaScript com HTML: ruclips.net/video/517xYbBApSA/видео.html