Discussion :

[Nico1131]

Bonjour,

Je pense que le titre explique clairement ce que je souhaite faire

Mais je vais quand même préciser. Je souhaite générer un pdf selon l'id (d'une div par exemple) qui récupère tout son contenu (ainsi que le style), un peut comme une capture d'écran mais en format pdf ^^

Du coup j'ai cherché un peut partout et j'ai trouvé plusieurs choses :

• Utiliser window.print() et utiliser "pdfcreator" : sauf qu'il prend en compte toute la page, et je n'ai pas trouvé comment lui dire de prendre juste le contenu de quelque chose
• Ou jsPDF, qui grâce à lui je peux spécifier la zone que je souhaite récupérer; le seul bémol c'est qu'il prend en compte que le texte; du coup si je veux récupérer un tableau bah tout ce qu'il va récupérer c'est le texte qui sera dedans et rien d'autres.
• Ou avec printArea, qui marche très bien dans l'ensemble avec "pdfcreator" sauf que je n'ai pas réussi à lui faire prendre en compte dans le pdf le css associé à l'élément.

Voilà en gros le résultat que cela me donne pour chacune des 3 méthodes : http://jsfiddle.net/Nq5D3/11/

NB: ce qui est bizarre c'est qu'avec la méthode jsPDF il me prend en compte la forme du tableau sur "jsfiddle" alors que quand je teste moi même il m'affiche que le texte et pas la mise en forme
Teste moi même :


Teste sur jsFiddle :


Auriez vous des suggestions pour m'aider ?

[danielhagnoul]

Bonsoir

Exemple avec PDFCreator en passant par un iframe.

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<div id="myDiv">
    <p>
        Bonjour,
 
        Je pense que le titre explique clairement ce que je souhaite faire
 
        Mais je vais quand même préciser. Je souhaite générer un pdf selon l'id (d'une div par exemple) qui 
        récupère tout son contenu (ainsi que le style), un peut comme une capture d'écran mais en format pdf ^^
 
        Du coup j'ai cherché un peut partout et j'ai trouvé plusieurs choses :
        Utiliser window.print() et utiliser "pdfcreator" : sauf qu'il prend en compte toute la page, et je n'ai pas 
        trouvé comment lui dire de prendre juste le contenu de quelque chose 
        Ou jsPDF, qui grâce à lui je peux spécifier la zone que je souhaite récupérer; le seul bémol c'est qu'il prend 
        en compte que le texte; du coup si je veux récupérer un tableau bah tout ce qu'il va récupérer c'est le texte 
        qui sera dedans et rien d'autres.
        Ou avec printArea, qui marche très bien dans l'ensemble avec "pdfcreator" sauf que je n'ai pas réussi à lui 
        faire prendre en compte dans le pdf le css associé à l'élément.
    </p>
</div>
 
<iframe id="myFrame"></iframe>
 
<button id="btnPrint">Print</button>

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$( function(){
 
    $( "#btnPrint" ).on( "click", function(){
        $( "#myFrame" )
            .contents()
            .find( "body" )
            .html( $( "#myDiv" ).html() );
 
        $( "#myFrame" )
            .get( 0 )
            .contentWindow
            .print();
    });
 
});

[Nico1131]

Merci pour ton aide

J'ai testé ton exemple sur mon code mais malheureusement sa revient au même résultat que j'ai pour l'instant. Je n'arrive pas à récupérer que ce soit sur l'iframe ou le pdf en lui même le css qui correspond au éléments de la div

J'ai essayé avec la méthode .css() (jQuery) mais ça ne fonctionne pas.

MAJ : http://jsfiddle.net/Nq5D3/15/

[Nico1131]

J'ai trouvé la solution à mon problème sur la récupération du style de base.
C'est les options d'impression qui de base les désactives.
Du coup j'ai trouvé ça : http://competitivite.gouv.fr/imprimer-la-page-650.html

Donc avec la méthode de printAera tout a l'aire de bien fonctionner en passant avec PDFcreator.
Sa sera ma solution alternative vu que je n'arrive pas à générer en un seul clique le pdf pour la méthode avec jsPDF qui ne me prend pas en compte la mise en forme et le style