Thanks for asking vonwolf! I found another solution to 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 that I cannot solve. I made the same pad signature and it works fine, no errors.
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 another simple example using ng-signature-pad
In addition, you can find other solutions:
https://www.sitepoint.com/4-jquery-digital-signature-plugins/
Tarek
source share