Come ottenere la stampa come risultato PDF utilizzando jquery

Question

Vorrei ottenere la pagina HTML nel PDF.

Dopo alcuni studi che ho trovato il plugin pdfJS, ha qualche problema con bootstrap, il layout sarà disordinato

http://jsfiddle.net/5ud8jkvf/

qui è il violino

ho trovato la stampa di default come risultato PDF è grande

var doc = new jsPDF(); 
var specialElementHandlers = { 
    '#editor': function (element, renderer) { 
     return true; 
    } 
}; 

$('#cmd').click(function() { 
    doc.fromHTML($('#content').html(), 15, 15, { 
     'width': 170, 
      'elementHandlers': specialElementHandlers 
    }); 
    doc.save('sample-file.pdf'); 
}); 

Quindi, invece di risolvere il problema per pdfJS, mi chiedo se ci sia il modo html/jquery per ottenere il pdf dalla stampa in pdf.

Il codice HTML necessità di convertire in PDF è solo una forma di utilizzo pagina, grazie mille

Answer 1

La versione corrente consente di ottenere il blob o il arraybuffer del pdf. L'unica cosa che dovete fare è quello di aggiornare da 0,9 a 1.2.x della biblioteca e chiamare salvare come questo

var myBlob; 

$('#cmd').click(function() { 
    doc.fromHTML($('#content').html(), 15, 15, { 
     'width': 170, 
      'elementHandlers': specialElementHandlers 
    }); 
    myBlob = doc.save('blob'); 
}); 

Answer 2

Può essere si può provare html2canvas (Sarà analizzare il DOM, Calcolare gli stili applicati).

(function(){ 
var 
form = $('.form'), 
cache_width = form.width(), 
a4 =[ 595.28, 841.89]; // for a4 size paper width and height 

$('#create_pdf').on('click',function(){ 
$('body').scrollTop(0); 
createPDF(); 
}); 
//create pdf 
function createPDF(){ 
getCanvas().then(function(canvas){ 
    var 
    img = canvas.toDataURL("image/png"), 
    doc = new jsPDF({ 
      unit:'px', 
      format:'a4' 
     });  
     doc.addImage(img, 'JPEG', 20, 20); 
     doc.save('techumber-html-to-pdf.pdf'); 
     form.width(cache_width); 
}); 
} 

// create canvas object 
function getCanvas(){ 
form.width((a4[0]*1.33333) -80).css('max-width','none'); 
return html2canvas(form,{ 
    imageTimeout:2000, 
    removeContainer:true 
    }); 
} 

}()); 

Ho trovato questo here. Si prega di controllare il link se volete maggiori informazioni.

Answer 3

Sembra che si sta tentando di stampare i dati della tabella in PDF Format.So è possibile utilizzare jQuery DataTables Collegare.

I datatables forniscono la libreria button in cui è possibile utilizzare il pulsante PDF. Il supporto sia per HTML5 che per Flash e il tipo di pulsante selezionano automaticamente tra le opzioni del pulsante Flash e HTML.

$('#myTable').DataTable({ 
buttons: [ 
    'pdf' 
] 
}); 

sua forniscono eccellere funzione di esportazione troppo, basta aggiungere excel pulsante.

$('#myTable').DataTable({ 
buttons: [ 
    'copy', 'excel', 'pdf' 
] 
}); 

Ho già utilizzato nella nostra applicazione che non entrerà in conflitto con il bootstrap.

Answer 4

Provare jsPDF-AutoTable (jsPDF plugin), questo può aiutare a convertire in PDF da HTML come si desidera. Dai un'occhiata allo demo