question

QamarMo-8446 avatar image
0 Votes"
QamarMo-8446 asked QamarMo-8446 commented

Save Canvas Control Image to a PDF using JavaScript, WebMethod andiTextSharp

I have a Canvas control (id=cnv) along with a few Input (type=text) controls in an aspx page and an input button control. When button is clicked, it calls StartSign() which calls SignResponse(event) and that calls the function SetValues(objResponse, imageWidth, imageHeight) to render signature on the “cnv” control.
The function SetValues(objResponse, imageWidth, imageHeight) sends all Session Variables (FName, LName) as a delimited string “name” to code behind in a WebMethod which saves data to a pdf file using iTextSharp.

BUT, I do not know how to pass and save the image (signature) which is created in the function SetValues().

Please help!
179451-codeforsession.txt


dotnet-aspnet-generaldotnet-aspnet-webformsdotnet-aspnet-webpages
codeforsession.txt (4.0 KiB)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

LanHuang-MSFT avatar image
0 Votes"
LanHuang-MSFT answered QamarMo-8446 commented

Hi @QamarMo-8446,
From your description, I suggest that you can use jqu ery toDataURL to convert the canvas to image/png format first.
We can then use ajax to send this image to a web method in code-behind.
Finally, we can save the image in the web method.
You can refer to the demo below.
179506-behind.txt
179905-front.txt
179508-1.jpg

Edit

  public static void UploadImage(string imageData)
         {          
             byte[] data = Convert.FromBase64String(imageData);
             Document pdfDoc = new Document();         
             var output = new FileStream(HttpContext.Current.Server.MapPath("2.pdf"), FileMode.Create);
             PdfWriter writer = PdfWriter.GetInstance(pdfDoc, output);
             pdfDoc.Open();
             iTextSharp.text.Image img = iTextSharp.text.Image.GetInstance(data);
              pdfDoc.Add(img);
              pdfDoc.Close();           
         }    
         protected void Button1_Click1(object sender, EventArgs e)
         {
             Process.Start(Server.MapPath("2.pdf"));
         }

179963-8.gif

Best regards,
Lan Huang


If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.



text.gif (174.3 KiB)
1.jpg (99.7 KiB)
behind.txt (595 B)
front.txt (2.0 KiB)
front.txt (2.1 KiB)
8.gif (142.6 KiB)
· 3
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi,
I have the attached`sample JavaScript from Topaz; it creates a signature image in SetValues2().
How do I get this image in WebMethod and add that to a pdf?

     <[179524-java.txt][1]


[1]: /answers/storage/attachments/179524-java.txt

0 Votes 0 ·
java.txt (2.8 KiB)

Hi @QamarMo-8446,
I edited my answer, you can check it out.

Best regards,
Lan Huang


If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

0 Votes 0 ·

Lan Huang, thank you so much for your help.

0 Votes 0 ·