פד חתימה דיגיטלי- מאפשר חתימה באמצעות העכבר בתוך אזור בדף באתר (משטח 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 שיצרנו:

   
האם מידע זה היה שימושי?