אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » פיתוח אינטרנט » הוספת JavaScript לטופס בדרופל 6 מול דרופל 7

הוספת JavaScript לטופס בדרופל 6 מול דרופל 7

רן בר-זיק נובמבר 11, 2012 7:52 am אין תגובות

כך מוסיפים JavaScript לטופס בצורה חכמה ואלגנטית בדרופל 6 ובדרופל 7

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

הנה משהו קצר ושימושי להפליא לכל מתכנתי הדרופל – הוספת JavaScript באמצעות form_alter.

לפעמים אנחנו צריכים להוסיף JavaScript לטופס זה או אחר. הטפסים הם בדרך כלל המקום שבו המשתמשים שלנו "נופלים" באופן הקשה ביותר והסקריפטים בצד הלקוח יכולים לעזור לנו להפוך אותם ליותר ידידותיים. לפיכך בלא מעט פעמים אנחנו רוצים להוסיף לטפסים שלנו סקריפטים שונים. באופן מפתיע משהו, לא מעט מתכנתים נוהגים לעשות את זה באמצעות הפקודה drupal_add_js דווקא ב-hook_form_alter.

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

מה עושים? אם אנחנו משתמשים בדרופל 6, משתמשים בדרך אחרת, קצת עקומה. במקום:


hook_form_alter(&$form, &$form_state, $form_id) {
drupal_add_js(drupal_get_path('module', 'my_module').'/js/my_js.js', array('type' => 'file', 'scope' => 'footer'));
}

אנו נשתמש בתכונת ה-after_build! התכונה הזו, שקיימת כמעט בכל אלמנט בטופס, מאפשרת לנו להריץ פונקציות PHP בכל רינדור של הטופס – גם מה-cache. איך עושים את זה? פשוט מאד!


hook_form_alter(&$form, &$form_state, $form_id) {
$form['some_field']['#after_build'] = array('_load_add_form_javascript');
}

function _load_add_form_javascript () {
drupal_add_js(drupal_get_path('module', 'my_module').'/js/my_js.js', array('type' => 'file', 'scope' => 'footer'));
}

הדרך הזו היא קצת עקומה, אבל היא הטובה ביותר בדרופל 6, בדרופל 7, אפשר להשתמש בדרך הזו:


hook_form_alter(&$form, &$form_state, $form_id) {
$form['#attached']['js'][] = drupal_get_path('module', 'my_module').'/js/my_js.js'
}

השימוש ב-attached מאפשר לנו גם להצמיד CSS, אבל אני משתמש בו כל הזמן על מנת להוסיף JavaScript ולהיות בטוח שהוא יתווסף בכל פעם. באופן עקרוני, אפשר להוסיף את ה-JS לטופס באמצעות פונקצית Theme, אבל זה כבר מאמר אחר.

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
דרופל

השארת תגובה

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד