Code

Discussion on HTML5 Signature Pad to Image

Discussion on HTML5 Signature Pad to Image

Cart 558 sales

mrFreelancer supports this item

Supported

This author's response time can be up to 2 business days.

103 comments found.

Hi, is there any advice on how to add this to a Wordpress site?

Hey Amber, thanks for for buying my web app. Technically, there shouldn’t be anything different you need to do to add it to wordpress. You can simply add the necc files and simply follow the provided guide. Msg me if you need further assistance. I do offer help for a small fee :)

Hi I love this signature pad script. but before purchase, 1 quick question. can I determine the name for the saved signature to be written into mysql.

2. can I determine the folder to save the signatures?

Yes, you can change the name of the generated file. But, you’ll have to create the script yourself if you wish to insert to mysql. You can privately email me if you wish for me to assist. I do charge a fair fee.

Hi There, I uploaded zip file contents in hosting server and extracted them. How can I see this signature pad in page?

Hi Daniel, thanks for purchasing! Unfortunately, it doesn’t work right “out of the box” in some cases, depending on your server set up. Besides, you probably don’t want to upload the entire zip content since some of it contains files you don’t need on your server. But you may be able to upload just the “demo” folder and content to get an idea of how it works. I don’t suggest using the demo files for your production files though. There’s a “Read Me” document that explains how to install in very easy short steps. Let me know if you still get stuck and I can assist.

Hello Friend buy your application and I worked very well, in the tablets and mobile but I have problems signing on my browser, the point of alignment of the signature is not fixed

help please

Hi hechiz3ro, thanks for supporting my webapp. What browser and platform (OS) are you experiencing this in?

It doesn’t work for me. I use Chrome 56.0.2924.87. Please fix it !

It doesn’t draw. I have already cleared the cache without solving the issue. I also tried by suspending the antivirus protection. If can be useful, on Microsoft Edge it works correctly. No error has been detected from Developer Tools->Console.

Sorry but I just can’t reproduce the issue. I’m using exact same version and it works perfectly fine. In addition, you can even test in this emulator to check older versions: https://www.browserling.com and works even as far back as Chrome 35

I used the emulator and it works, but on a different Windows version. I can’t emulate it on Windows 10!

Thanks for the great script,

Is it possible to load a png in the signature canvas?

Hi Robiz, yes it’s possible.You’ll have to create your own script to manage that. If you wish, I can assist for a small fee. Just hit me up privately.

Also if you like this web app, please do rate it. I’d greatly appreciate it :)

Worked somtehing out already.. works like a charm!

var img = new Image(); img.src = ’##YOUR URL###’; img.onload = function(){ var canvas = document.getElementById(‘dd_canvas’); var ctx = canvas.getContext(‘2d’); ctx.drawImage(img, 0, 0); }

awesome! That definitely works :)

Hello,

i have downloaded the code and made minor changes but can’t get the demo to work the browser says can’t save image please try again.

here is my link

http://joneschris903.hopto.org/suresign/SureSignmobile/

Sorry defjam903, I’ve been away for a few weeks. Do you still assistance?

Hi, I’ve purchased your software and it nearly works a treat, Is there a way to save the signature to a different name for each signature as it currently over wright each time a new signature is saved. Regards Albetws

I’m sorry for the late reply. Did not realize I had this comment. Yes, you can actually dynamically change the name of it via Javascript. Please see the included documentation. If you need assistance still, just privately email me and I’ll point you in the right direction.

Hi,

For some reason, this only works for me in Firefox. On other browsers (tested it on Chrome, IE, Opera), when hovering over the box the ‘pencil’ icon shows, but nothing happens when I try to draw.

Any ideas what could be wrong?

Hi Berrern, thanks for purchasing. I ran through several tests and just checked it in Chrome 52 and Opera 39, and both work fine. However, there appears to be an issue with IE if the signature app is contained within an iframe. The draw vertical placement is off alignment.

You can test here in IE9 – 11 and see it does work: http://dreamdesignsweb.com/dev/

It’s probable that you have something on your page that’s skewing the vertical drawing coordinates?

How does this work with pdf docs? Would like to use it for contracts etc.

Thank you!

It doesn’t work directly in a PDF document. However, since this generates a PNG of the signature, you can have a set of scripts (perhaps like TCPDF), add it to the PDF. Send me a private email should you wish to get help in this regard as a separate service.

Is there a way to set width and height in percentage? I want it to be mobile responsive. Thanks

unfortunately, it’s currently no possible. The dimensions are established upon object instantiation, so this means it must know the width/height in order to determine line drawing points. I hope that makes sense. You can however re-instatiate based on screen dimesions… you’ll have to write this logic out yourself.

Hi. Would it be easy to change the pencil to a finger? And can I take away all the options. Just want to make a signature areas is all? Don’t need pencil thickness or anything. Thanks

Yes sir. All those are options that can be controlled. Plz reference the manual. Do let me know if you have further questions. Thanks for buying!

I see that you are offering to help with database insertion for an additional fee. Are you still offering that service?

Hello kidd56, sorry for the late reply. Been away for the new year. Yes, please hit me up privately for additional services.

Thanks!

Hi,

I’m interested to buy HTML5 Signature Pad. Would I be able to implement it within a HTML5 page with other element.

Would I be able to set the path to save as per needed except default download folder.

Thanks for your interest. What “other” element are you referring to? As of now, you can implement it on whatever valid html tag. It simply writes the code to that tag.

Yes, you can set your own save path. It just defaults to “tmp” folder.

Hope that helps!

This script is brilliant, exactly what I needed. I can make the customer sign the contract and put their mark? how can I do this? There is another plugin for the customer to sign with the mouse pointer or finger, and put your fingerprint. I want to buy your script. but I have to know this. Congratulations.

Thanks Maritas. This web app does allow you to use a mouse or finger to sign BUT does not do fingerprints.

I’m planing to purchase it and I realize it useing PHP and i’m planning to use it in .NET project, so is it depends on PHP or only HTML5 and JS ??

Regards, Alex

The PHP file is only used for taking the base64 data and converting to an img with proper imagick PNG transparency support. Otherwise, everything else is HTML5/JS. So theoretically, you should be able to have a .NET equiv. Hope that helps.

Hi, i need to put the Save Signature button on the right of the box of signs or over the box.

How i can do it? Thank you.

I’m sorry, can you better explain what you’re trying to do?

hi i just buy your software but i think i want to know from you that after click on save button how to display the image in browser in the main time i save the image on server side .

HI any comment about this issue?

Sorry, been on the road for a few weeks. After it saves the image, it returns the name of the image back to you in the callback. From there you can write your own Javascript to display it to the screen. You’ll probably want to read through the docs and also see the comments in the Javascript file. Shoot me an email if you’d like additional help.

This script is brilliant, exactly what I needed. Only two questions:

1. Is it possible to change the color of the button? I looked in the code and could not see reference to this.

2. I’m trying to submit a form via php to email. How would you best attach the saved PNG or link to it?

Thank you! I’m glad you can use it. 1. Yes, you can change color of button. You can do so in the “dd_signature_pad.css” file that came with the package. The CSS Class is ”#dd_saveButton” 2. The signature saved as a PNG is located in a “tmp” directory, (or whatever the name of your designated directory). In fact, you can reference the file name in the JS file. The variable is “dd_outputFileName”.

Hope this helps :)

My apologies, the one place I overlooked was the CSS file. So obvious. Haha.

Thanks for the help.

Good Job, Incredible plugin! Thanks for this script.

Thank you. Do keep an eye out for a new update coming soon!

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey