בניית דף טופס לעריכת רשומה

דף טופס (Form Page) מאפשר לצפות ולערוך רשומה בודדת מתוך טבלה במסד הנתונים. הטופס מציג את שדות הרשומה בפריסה נוחה, ואפשר להוסיף אליו רכיבים נוספים כמו טבלאות משנה, גרפים, מונים וטקסטים.

דף טופס הוא המקום שבו המשתמשים עובדים עם רשומה בודדת — עורכים פרטי לקוח, מעדכנים סטטוס עסקה, או מזינים מידע חדש. בניגוד לדף תצוגת טבלה שמציג רשימת רשומות, דף הטופס מתמקד ברשומה אחת ומאפשר עריכה מלאה שלה. מדריך זה מלווה אתכם משלב היצירה ועד לבניית דף טופס מלא ועשיר.

יצירת דף טופס

שלב 1: יצירת הדף הבסיסי

1. הגדירו את שם הטבלה (tableName) — הטבלה שהטופס יציג את הרשומות שלה, לדוגמה Projects.
2. הגדירו את שם הדף (pageName) בפורמט: apps/mybusiness/TableName (ביחיד, לא ברבים). לדוגמה: apps/mybusiness/Project.
3. הגדירו כותרת הדף (title) בעברית — זו הכותרת שתופיע בדפדפן ובראש הדף, לדוגמה: "פרטי פרויקט".

שימו לב: לאחר יצירת הדף, הוא יהיה ריק לחלוטין — ללא שדות. עליכם להוסיף שדות ורכיבים בשלב הבא.

דף טופס ריק לאחר יצירה — המבנה קיים אך עדיין אין שדות

הבנת מערכת הרשת (Grid System)

דף הטופס בנוי על מערכת רשת של 12 עמודות. כל שורה (Row) בדף מחולקת לעמודות (Columns), וגודל כל עמודה נקבע כחלק מתוך 12:

הוספת שדות לטופס

להוספת שדה חדש לטופס, הגדירו את הפרמטרים הבאים:

מיקום השדה בדף

לכל שדה, הגדירו את מיקומו בדף באחת משתי דרכים:

• בשורה קיימת: השתמשו ב-toExistingRow (מזהה השורה) ו-toExistingColumn (מספר העמודה, מתחיל מ-0).
• בשורה חדשה: השתמשו ב-newRowAfterRow (מזהה השורה שאחריה תיווצר שורה חדשה).

דוגמה: הוספת שלושה שדות

נניח שאתם רוצים להוסיף שדות לטופס פרויקט. התהליך:

1. צרו שורה חדשה עם חלוקת עמודות [6, 6] (שני שדות בשורה).
2. הוסיפו שדה Name (שם הפרויקט) לעמודה 0.
3. הוסיפו שדה AccountId (לקוח, Pointer ל-Accounts) לעמודה 1.
4. צרו שורה נוספת עם חלוקת עמודות [12] (שדה ברוחב מלא).
5. הוסיפו שדה Description (תיאור) לעמודה 0.

דף טופס לאחר הוספת שדות — שני שדות בשורה הראשונה ושדה ברוחב מלא בשנייה

הוספת רכיבים נוספים

מעבר לשדות רגילים, ניתן להעשיר את דף הטופס ברכיבים נוספים:

טבלת משנה (Sub-Table)

טבלת משנה מציגה רשומות מטבלה אחרת שמקושרות לרשומה הנוכחית. לדוגמה, בטופס פרויקט ניתן להציג טבלת משימות.

דרישה: הטבלה המוצגת חייבת להכיל שדה Pointer שמצביע לטבלה של הטופס. לדוגמה, טבלת Tasks צריכה שדה ProjectId מסוג Pointer ל-Projects.

הגדרות טבלת המשנה כוללות:

• tableName — שם הטבלה להצגה (למשל Tasks)
• fields — רשימת השדות להצגה בטבלת המשנה
• allowCreate — האם לאפשר יצירת רשומות חדשות מתוך הטופס
• allowInlineEdit — האם לאפשר עריכה ישירה בתוך הטבלה

מונים (Counters)

מונים מציגים ערך מספרי מחושב — למשל, סך כל השעות בפרויקט, מספר המשימות הפתוחות, או ממוצע ציונים. המונה מסנן אוטומטית לפי הרשומה הנוכחית בטופס.

גרפים (Charts)

גרפים מציגים נתונים ויזואלית — עוגה, עמודות, קו או טבעת. כמו המונים, גם הגרפים מסוננים אוטומטית לפי הרשומה הנוכחית.

טקסטים וכותרות

ניתן להוסיף כותרות (H1-H4) וטקסטים (P) כדי לארגן את הטופס לקבוצות לוגיות ולהוסיף הסברים.

דף טופס מלא — שדות טופס, טבלת משנה של משימות וגרף התקדמות

חיבור דף הטופס לדף תצוגת הטבלה

כדי שהמשתמשים יוכלו לפתוח רשומה לעריכה מתוך דף רשימת הטבלה, ודאו ששם דף הטופס (ללא הקידומת apps/mybusiness/) מוגדר כ-editEntityPageName בדף תצוגת הטבלה.

לדוגמה, אם שם דף הטופס הוא apps/mybusiness/Project, ערך ה-editEntityPageName צריך להיות Project.

הוספת כללי טפסים (Form Rules)

כללי טפסים מוסיפים התנהגות דינמית לטופס — הסתרת שדות, חובת מילוי מותנית, חישוב ערכים אוטומטי ועוד. לפרטים מלאים, עיינו במדריך כללי טפסים (Form Rules).

טיפים

• התחילו מהשדות החשובים — הוסיפו קודם את השדות שהמשתמשים צריכים לראות ולערוך בכל יום. שדות פחות חשובים יכולים להתווסף בהמשך.
• ארגנו בקבוצות — השתמשו בכותרות כדי לחלק את הטופס לאזורים לוגיים (פרטים כלליים, פרטים כספיים, הערות וכו').
• רוחב שדות — שדות טקסט קצרים (שם, טלפון) שימו בעמודות של 6 או 4. שדות טקסט ארוכים (תיאור, הערות) שימו בעמודה של 12 (רוחב מלא).
• טבלאות משנה — אם יש לכם ישות צאצא (שורות עסקה, משימות פרויקט), הוסיפו טבלת משנה במקום לשלוח את המשתמש לדף אחר.
• בדקו את התוצאה — לאחר כל שינוי בדף, רעננו את הדפדפן כדי לראות את התוצאה הסופית. שינויים בדף הטופס דורשים טעינה מחדש.