convert div to image and download it when div content dynamically changed not working properly
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
function ConverToImage() {
document.getElementById('<%=lblSelectedDivClass.ClientID%>').style.display = "block";
var divId = document.getElementById('<%=lblSelectedDivClass.ClientID%>').innerText;
alert("."+divId);
document.getElementById('<%=lblSelectedDivClass.ClientID%>').style.display = "none";
if (divId == "") {
alert("Please Select Template First");
return false;
}
html2canvas($("." + divId), {
onrendered: function (canvas) {
var imgsrc = canvas.toDataURL();
$('#hdnImage').attr('value', imgsrc);
}
});
html2canvas($(".bTemplate1"), {
onrendered: function (canvas) {
var imgsrc = canvas.toDataURL();
$('#hdnImage').attr('value', imgsrc);
}
});
}
<asp:Button ID="btnDownload" runat="server" Text="Download" OnClick="btnDownload_Click" OnClientClick="ConverToImage()" />
<asp:HiddenField ID="hdnImage" ClientIDMode="Static" runat="server" />
<asp:Label ID="lblSelectedDivClass" style="display:none;" runat="server" Text=""></asp:Label>