Black page after 7 pages

Hi, I readed each post like mine but you don’t give answers so I try.

Here is my code to generate a pdf with multiple pages. Each page take the content of a div it’s class is ‘une_page’ : `$(‘#printPDF’).click(function () { var pdf = new jsPDF(‘portrait’); var pdfName = $(this).data(‘titre’);

    var options = {};

    var $divs = $('.une_page')                //jQuery object of all the myDivClass divs
    var numRecursionsNeeded = $divs.length -1;     //the number of times we need to call addHtml (once per div)
    var currentRecursion=0;

    //Found a trick for using addHtml more than once per pdf. Call addHtml in the callback function of addHtml recursively.
    function recursiveAddHtmlAndSave(currentRecursion, totalRecursions){
        //Once we have done all the divs save the pdf
        if(currentRecursion==totalRecursions){
            pdf.save(pdfName);
        }else{
            currentRecursion++;
            pdf.addPage();
            //$('.myDivClass')[currentRecursion] selects one of the divs out of the jquery collection as a html element
            //addHtml requires an html element. Not a string like fromHtml.
            pdf.addHTML($('.une_page')[currentRecursion], 0, 0, options, function(){
                console.log(currentRecursion);
                recursiveAddHtmlAndSave(currentRecursion, totalRecursions)
            });
        }
    }

    pdf.addHTML($('.une_page')[currentRecursion], 0, 0, options, function(){
    	console.log(currentRecursion);
        recursiveAddHtmlAndSave(currentRecursion, numRecursionsNeeded);
    });
});`

It works fine but after the 6th page, everything is black.

Can you please help me ?

Thanks a lot.

[yannsainty]

Problem solved.

I just hide elements when it’s added so canvas limit is never reached.

Here is my solution if it can helps someone : `$(‘#getPDF’).click(function () { var pdf = new jsPDF(‘portrait’); var pdfName = $(this).data(‘titre’); var options = {}; var $divs = $(‘.une_page’) //jQuery object of all the myDivClass divs var numRecursionsNeeded = $divs.length -1; //the number of times we need to call addHtml (once per div) var currentRecursion=0;

    function recursiveAddHtmlAndSave(currentRecursion, totalRecursions){
        if(currentRecursion==totalRecursions){ //Si c'est la dernière page
            pdf.save(pdfName); //On enregistre le pdf
            $('.une_page').show(); //On raffiche le pdf dans la page
        }else{
            currentRecursion++;
            pdf.addPage(); //On créé une nouvelle page pdf
            pdf.addHTML($('.une_page')[currentRecursion], 0, 0, options, function(){ //On ajoute la page dans le pdf
    			$('.une_page').eq(currentRecursion).hide(); //On cache la page pour éviter de dépasser la limit du canvas
                recursiveAddHtmlAndSave(currentRecursion, totalRecursions); //On rappelle la fonction pour la page suivante
            });
        }
    }

    pdf.addHTML($('.une_page')[currentRecursion], 0, 0, options, function(){
    	$('.une_page').eq(currentRecursion).hide();  //On cache la page pour éviter de dépasser la limit du canvas
        recursiveAddHtmlAndSave(currentRecursion, numRecursionsNeeded);//On appelle la fonction pour la page suivante
    });
});`

[Robson-Vasconcelos]

@yannsainty you saved my day. Good solution, thanks.