Menu
I am using the MEAN stack and I would like to implement a digital signature for employees with a form but I cannot find any library or tutorial on this topic.
Has anyone done this? What would be the right approach to do this?
990
Thank you for the question vonwolf! I found another solution check this:
https://github.com/legalthings/angular-signature
However, I tried to implement a simple example using the above, but I see errors in the console which I cannot resolve. I did the same ng-signature-pad, and it is working just fine without any error.
Simple example using angular-signature Control
<!DOCTYPE html>
<html>
<head>
<title>Sample angular-singature</title>
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
<script src="https://cdn.rawgit.com/legalthings/angular-signature/master/src/signature.js"></script>
<script src="https://cdn.rawgit.com/szimek/signature_pad/master/signature_pad.js"></script>
<style>
.nowrap {
white-space:pre-wrap;
word-wrap:break-word;
}
</style>
</head>
<body ng-app='app' ng-controller='SignModalCtrl'>
<h1>Angular Signature Sample</h1>
<signature-pad accept="accept" clear="clear" height="220" width="568"></signature-pad>
<button ng-click="clear()">Clear signature</button>
<button ng-click="doAccept()">Sign</button>
<pre class='nowrap' ng-bind="accept().dataUrl"></pre>
<script>
var app = angular.module('app', [
'signature',
]);
app.controller('SignModalCtrl', [
'$scope',
function($scope) {
$scope.doAccept = function () {
var signature = $scope.accept();
console.log('doAccpet', signature)
}
$scope.done = function() {
var signature = $scope.accept();
if (signature.isEmpty) {
$modalInstance.dismiss();
} else {
$modalInstance.close(signature.dataUrl);
}
};
}
]);
</script>
</body>
</html>
And, here is the other simple example using ng-signature-pad
Also, you can find other solutions:
https://www.sitepoint.com/4-jquery-digital-signature-plugins/
Tarek
197
answered Sep 18 '22 12:09
Check out ngSignaturePad. It uses SignaturePad jQuery plugin.
https://github.com/ecentinela/ng-signature-pad
20
answered Sep 21 '22 12:09
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With