Added a new signature pad element and styling for the new element #1576
Conversation
Added signature pad element and added styling for the new signature pad element
|
Thank you for your contribution, I'll give this a test run. Could you please create some Jest tests to ensure the control is working as expected? |
|
@keerthi-balaji Has the code for the signature pad come from another project or is this an original implementation? I know of a few plugins out there https://github.com/szimek/signature_pad with advanced implementations of a canvas signatory pad. |
There was a problem hiding this comment.
Excellent contribution! Signature pad is a long requested feature and I like that this is a simple implementation that is small enough to be bundled with formBuilder.
As @lucasnetau mentioned it needs some tests, here is an example of a custom control test here: https://github.com/kevinchappell/formBuilder/blob/master/tests/form-builder-custom.test.js
Some additional thoughts:
- The label needs some work when rendered
- Can the Clear button be moved to appear inside the signature pad to avoid confusing it with a form clear button?
- The
valueis not saved with other user values in FormData or theuserData
Overall great addition, just needs a few minor tweaks.
src/sass/_controls.scss
Outdated
| } | ||
|
|
||
| .signature-pad { | ||
| //display: block; |
src/sass/form-render.scss
Outdated
| } | ||
|
|
||
| .signature-pad { | ||
| //display: block; |
It is an original implementation... I was just wanting to add a signature pad element to the form builder. |
…he button to 'clear signature', and styled the button to match the background
merge new changes
Fixed the label and placed the clear button within the canvas
Saved the signature to form data and created the tests
|
Hi, sorry it took so long but I did make the changes as requested. |
The signature pad element is designed using canvas and styled the element to differentiate it from its surrounding space.