Как напечатать несколько html2canvas - PullRequest
0 голосов
/ 12 июня 2018

У меня есть форма с несколькими шагами.Тем не менее, я хотел бы распечатать их отдельно и сохранить.Проблема в том, что до того, как html2canvas завершит рендеринг, информация была сохранена.Поэтому файл изображения становится пустым.Ниже мой код.

    html2canvas($('#content'), {
    onrendered: function (canvas) {
            var all = document.getElementsByClassName("tab");
            html2canvas(document.getElementsByClassName("tab")[0], {
                onrendered: function (canvas) {
                    Student.DocumentData = canvas.toDataURL().replace(/^data[:]image\/(png|jpg|jpeg)[;]base64,/i, "");
                    Student.DocumentName = 'Student Registration Form';
                }
            })
            html2canvas(document.getElementsByClassName("tab")[1], {
                onrendered: function (canvas) {
                    Student.DocumentData2 = canvas.toDataURL().replace(/^data[:]image\/(png|jpg|jpeg)[;]base64,/i, "");
                    Student.DocumentName2 = 'SPH Form';
                }
            })
            html2canvas(document.getElementsByClassName("tab")[2], {
                onrendered: function (canvas) {
                    Student.DocumentData3 = canvas.toDataURL().replace(/^data[:]image\/(png|jpg|jpeg)[;]base64,/i, "");
                    Student.DocumentName3 = 'Parent Consent Form';
                }
            })
        }
        var request = $.ajax({
            url: "/API/Students/",
            method: "POST",
            cache: false,
            data: Student,
            dataType: "json",
            error: function (jqXHR, status, error) {
                alert(jqXHR.status + '. ' + jqXHR.statusText + '. ');
            },
            success: function (data, status, jqXHR) {
                var msg = "";
                for (index = 0; index < data.Message.length; ++index) {
                    msg += data.Message[index] + "\n";
                }
                alert(msg);
                if (data.StudentID !== 0) {
                    $("input[id!='btnSubmit'],select,textarea").each(function () {
                        $(this).val('');
                    });
                }
                location.reload();
            },
            complete: function (jqXHR, status) {
                $('#btnSubmit').prop('disabled', false);
            }
        });

    }
});
...