פד חתימה דיגיטלי- מאפשר חתימה באמצעות העכבר בתוך אזור בדף באתר (משטח canvas של HTML5). בטלפון נייד, החתימה מתבצעת באמצעות ציור עם האצבע.
קיימות פונקציות מובנות לעבודה עם המשטח בספריית signature_pad.js.
ניתן למצוא הסברים כאן: https://github.com/szimek/signature_pad
הפונקציות השימושיות ביותר לנו הן clear שמנקה את המשטח ו- toDataUrl שמאפשרת לקבל את החתימה כשדה base64, אותו ניתן לשלוח ב-textarea לשרת כחלק מטופס.
שלבי יצירת טופס עם canvas לחתימה דיגיטלית ושליחת החתימה כשדה בטופס, לשרת:
יש להעלות את ספריית החתימה הדיגיטלית לשרת ולקשר אותה לאתר. עותק שלה נמצא כאן: http://ntt.co.il/help/library/signature_pad.js
יצירת משטח canvas בטופס וכפתור ניקוי חתימה, עטופים בdiv עם id מסוים:
יצירת שדה נסתר בטופס מסוג textarea שלתוכו תיכנס החתימה לאחר שהמרנו אותה ל-base64
הוספת הסקריפט הבא:
הוספת פונקצייה בעת שליחת הטופס לבדיקה שבוצעה חתימה, והזנה של החתימה לתוך ה-textarea שיצרנו: