הערה:
רכיבי Widget מסוג Spry מוחלפים ברכיבי Widget של jQuery ב-Dreamweaver CC ואילך. בעוד שניתן עדיין לשנות רכיבי Widget קיימים מסוג Spry בדף, לא תוכל להוסיף רכיבי Widget חדשים מסוג Spry.
רכיב widge מסוג אמות אישור הוא שדה טקסט או שדה סיסמה בטופס המציג מצבים חוקיים או לא חוקיים, כשמשתמש מזין ערך שאינו מתאים לערך של שדה דומה באותו טופס. לדוגמה, ניתן להוסיף רכיב Widget מסוג אימות אישור לטופס הדורש שהמשתמש יקליד שוב את הסיסמה שציין בשדה קודם. אם המשתמש אינו מצליח להקליד את הסיסמה בדיוק כפי שרשם אותה קודם לכן, הרכיב יחזיר הודעת שגיאה שתציין שהערכים אינם זהים.
ניתן גם להשתמש ברכיב Widget מסוג אימות אישור בצירוף לרכיב Widget מסוג אימות שדה טקסט כדי לאמת כתובות דוא"ל.
הערה:
יש להכיר את רכיבי Widget מסוג אימות של Spry לפני שתתחיל לעבוד עם רכיב אישור של Spry. If you’re not familiar with them, see עבודה עם רכיב Widget מסוג אימות שדה טקסט או כל אחת מהסקירות על יתר רכיבי Widget מסוג אימות לפני שתמשיך. בסקירה זו לא מוצגים כל המושגים הבסיסיים לגבי רכיבי Widget מסוג אימות.
רכיב Widget מסוג אימות אישור כולל מספר מצבים (לדוגמה, חוקי, לא חוקי, ערך דרוש וכולי). ניתן לשנות את המאפיינים של מצבים אלה בעזרת עריכת קובץ CSS המתאים (SpryValidationConfirm.css), בהתאם לתוצאות האימות הרצויות. רכיב Widget מסוג אימות אישור יכול לבצע אימות במספר שלבים – לדוגמה, כשמבקר באתר לוחץ מחוץ לרכיב, כשהוא מקליד, או כשהוא מנסה למסור את הטופס.
מצב Invalid
כשמשתמש מזין טקסט שאינו מתאים לטקסט שהוזן בשדה טקסט קודם, ברכיב Widget מסוג אימות שדה טקסט, או ברכיב Widget מסוג אימות סיסמה.
להסבר מקיף יותר לגבי אופן הפעולה של רכיבי Widget מסוג אימות אישור, וכן מידע נוסף לגבי מבנה רכיבי Widget, ראה www.adobe.com/go/learn_dw_spryconfirm_il.
הערה:
ניתן גם להוסיף רכיב Widget מסוג אימות אישור בעזרת הקטגוריה Spry בחלונית Insert.
כברירת מחדל, כל רכיבי Widget מסוג אימות אישור שתוסיף בעזרת Dreamweaver דורשים קלט של המשתמש כשהם מתפרסמים באתר אינטרנט. עם זאת, תוכל להגדיר שמילוי שדות הטקסט לאישור על-ידי המשתמש יהיה אופציונלי.
ניתן להגדיר מתי יתבצע האימות – כשמבקר באתר לוחץ מחוץ לרכיב Widget, כשהוא מקליד, או כשהוא מנסה למסור את הטופס.
למרות שמפקח המאפיינים מאפשר לבצע פעולות עריכה פשוטות ברכיב Widget מסוג אימות אישור, הוא אינו תומך בסגנון עיצוב מותאם אישית. ניתן לשנות את כלל CSS לרכיב Widget מסוג אימות אישור, כדי שתוכל ליצור רכיב בסגנון הרצוי לך. לרשימה מתקדמת של משימות עיצוב סגנונות, ראה www.adobe.com/go/learn_dw_spryconfirm_custom_il.
כל כללי CSS בסעיפים הבאים מתייחסים לכללי ברירת המחדל המאוחסנים בקובץ SpryValidationConfirm.css. Dreamweaver שומר את הקובץ SpryValidationConfirm.css בתיקייה SpryAssets באתר כל פעם שאתה יוצר רכיב Widget של Spry מסוג אימות אישור. עיון בקובץ זה יכול להועיל, משום שהוא כולל מידע לגבי סגנונות שונים החלים על רכיב זה.
הערה:
למרות שניתן בקלות לערוך כללים לרכיב Widget מסוג אימות אישור בקובץ CSS הנלווה, ניתן גם להשתמש בחלונית CSS Styles כדי לערוך את סגנון CSS של הרכיב. החלונית CSS Styles עוזרת לאתר מחלקות CSS שהוקצו לחלקים שונים של רכיב Widget, במיוחד אם אתה משתמש במצב Current של החלונית.
הקובץ SpryValidationConfirm.css כולל הערות מפורטות, המסבירות את הקוד ואת המטרה של כללים מסוימים. למידע נוסף, ראה ההערות בקובץ.
כברירת מחדל, הודעות שגיאה לרכיב Widget מסוג אימות אישור מופיעות באדום, עם גבול אחיד בעובי פיקסל אחד מסביב לטקסט.
-
לשינוי סגנון הטקסט של רכיב Widget מסוג אימות אישור, היעזר בטבלה הבאה לאיתור כלל CSS המתאים, ושנה את מאפייני ברירת המחדל, או הוסף מאפייני וערכי סגנון טקסט משלך.
טקסט לשינוי
כלל CSS מתאים
מאפיינים רלוונטיים לשינוי
טקסט של הודעת שגיאה
.confirmRequiredState .confirmRequiredMsg, .confirmInvalidState .confirmInvalidMsg color: #CC3333; border: 1px solid #CC3333;
-
לשינוי צבעי הרקע של רכיב Widget מסוג אימות אישור במצבים שונים, השתמש בטבלה הבאה לאיתור כלל CSS המתאים, ושנה את ערכי ברירת המחדל של צבע הרקע.
צבע לשינוי
כלל CSS מתאים
מאפיין רלוונטי לשינוי
צבע רקע של רכיב Widget במצב חוקי
.confirmValidState input, input.confirmValidState background-color: #B8F5B1;
צבע רקע של רכיב Widget במצב לא חוקי
input.confirmRequiredState, .confirmRequiredState input, input.confirmInvalidState, .confirmInvalidState input background-color: #FF9F9F;
צבע רקע של רכיב Widget במצב התמקדות
.confirmFocusState input, input.confirmFocusState background-color: #FFFFCC;
הודעות המתפרסמות ב- Twitter™ ו- Facebook אינן מכוסות בתנאי Creative Commons.