עזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה
-
אני משתמש ב ag grid ואני רוצה שברשימה נפתחת באחד התאים הערכים יתקבלו בזמן אמת מה DB שלי, עשיתי פונקצייה שמחזירה את הנתונים אבל נראה שהוא לא מחכה לתשובת השרת והוא כותב לי שאין לו נתונים
הנה הקוד הרלוונטיvar selected = (params) => { rows = fetch("api.php?action=selectBuildings2") .then(response => response.json()) .then(function (response) { console.log(response); return { values: response, }; }); } var rows; var gridOptions = { columnDefs: [ { headerName: '#', field: 'id', filter: true }, { headerName: 'שם קומה', field: 'name', filter: true, editable: true }, { headerName: 'שיוך לבניין', field: 'building', filter: true, editable: true }, { headerName: 'מין', field: 'type', filter: true, editable: true, cellEditor: 'agSelectCellEditor', cellEditorParams: selected, }, { headerName: 'מחיקת נתון', field: 'del', onCellClicked: CellDoubleClickedDell, cellRenderer: function () { return `<img src='../ipIcons/delete.png' style='width: 30px; height: 30px;' />`; }, }, ], rowData: rows, enableRtl: true, defaultColDef: { flex: 1, minWidth: 80, }, onCellValueChanged: CellDoubleClickedchaged, }; var gridDiv = document.querySelector('#myGrid'); api = agGrid.createGrid(gridDiv, gridOptions); } });
אשמח לעזרה
-
ברוך הבא לJS! זו השאלה הקלאסית ביותר על אסינכרוניות בJS.
אבל בקוד שלך גם חסר קריאה לפונקציה selected, כך שיש פה עוד שכבת בעיה.אני אסביר:
שורות 1-11 מגדירות פונקציה בתוך משתנה בשם selected. אם רוצים שהפונקציה תריץ, צריך לקרוא לה, כלומר לכתובselected();
אם הפונקציה הייתה מחזירה ערך (והיא במקרה שלנו לא ממש מחזירה), אז אפשר לשים את התוצאה ישר במשתנה:
var x = selected();
שלב הקריאה לפונקציה חסר אצלך, נניח שים מתחת להצהרה של rows בשורה 13 קריאה לselected, או שבכלל תעביר את המתודה fetch מתוך הפונקציה על הקוד עצמו מתחת ל13, ואז לא צריך לקרוא לשום פונקציה.
כל זה אם זו פונקציה ש"סתם" עושה משהו, ולא קריאה לאינטרנט שזו סוג פעולה אסינכרונית.
פעולה אסינכרונית מחייבת אחד מהשניים: או טיפול המשך בפונקציית הקאלבק (במקרה הזה הthen), או שימוש בawait שנותן תחושה נחמדה יותר של קוד סדרתי. תוכל לקרוא עוד על פונקציות אסינכרוניות בJS פה באתר.
https://tchumim.com/post/105384
https://tchumim.com/topic/13087
https://tchumim.com/topic/1257יש כנראה עוד.
-
בשביל השלב הבא, async await, אני ממליץ על שני המקורות האלה:
https://davidwalsh.name/async-await
https://internet-israel.com/מדריכים/es20xx/es2017-async/ -
@dovid כתב בעזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה:
אבל בקוד שלך גם חסר קריאה לפונקציה selected, כך שיש פה עוד שכבת בעיה.
גם אני הבנתי ככה (אני לא כזה עם הארץ...) אבל הסתמכתי על הדוגמא פה - תעשה הצגת קוד ותראה שגם שם הוא עושה כזה דבר - מכניס משתנה שהוא פונקצייה
בלוג של שורה 6 הוא מחזיר לי בדיוק את מה שאני רוצה לקבל, אבל כבר לפני זה אני מקבל שגיאה שאין ערכים לבחירה - זה אומר כמו שכתבתי שהוא לא מחכה לתשובה
@dovid כתב בעזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה:
(והיא במקרה שלנו לא ממש מחזירה)
למה לא?
@dovid כתב בעזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה:
או שימוש בawait
ניסיתי לעשות משהו כזה אבל לא עזר
var selected = async (params) => { const response = await fetch("api.php?action=selectBuildings2") const data = await response.json(); console.log(data); return { values: data, }; }
עריכה:
מה שנראה לי כרגע שבתוך הפונקצייה הוא כן מחכה, והראייה שבconsole.log(data);
אני מקבל את התוצאה, הבעיה היא כנראה שה ag אינו מחכה ומיד ממשיך, השאלה היא האם אפשר להגיד לו לחכות, כי כאמור
כאן רואים שקודם ה ag מתלונן שאין לו ערכים ומיד אח"כ מגיע התשובה... כך שפשוט הוא אינו מחכה...
עריכה נוספת...:
ניסיתי לעשות את הקוד בתוכו בלי הפניות וקריאות (כמו שיש דוגמאות שם){ headerName: 'מין', field: 'type', filter: true, editable: true, cellEditor: 'agSelectCellEditor', cellEditorParams: params => { rows = fetch("api.php?action=selectBuildings2") .then(response => response.json()) .then(function (response) { console.log(response); return { values: ['New York', 'Los Angeles', 'Chicago', 'Houston'], }; }); }, },
וכאן גם עשיתי שיוחזר מערך מוכן אחרי הקריאה שלא יהיו תירוצים שלא חוזר תקין וכו', אבל גם אז, קודם קיבלתי שגיאה שאין ערכים ואח"כ קיבלתי את הלוג יפה!
ואם אני מוריד את fetch כך שאין לו זמן המתנה רק return אז הוא מדפיס את זה יפה
בקיצור, אין לו סבלנות... השאלה איך נותנים לו... -
@ששא המאפיין cellEditorParams מקבל פונקציה ומריץ אותה, ורק לכן הקוד שלך רץ.
cellEditorParams לא אמור למלאות את השורות, אלא לתת רשימת השלמה למילוי, אין לי מושג מה נתקעת על זה בשביל פונקציה לטעינת המידע.לגבי חוסר הסבלנות עניתי לך, השאלה אם יש לך ולי סבלנות לגשר בין חוסר הידע שלך לצורך פה...
אתה כן עם הארץ בJS (כמו שאני עם הארץ בהפעלת מלגזה או בשפת Rust).
יש לך שני אפשרויות: א. לבקש עזרה שזה תכלס יעבוד לא משנה איך ב. לנסות להבין לאט לאט איך זה עובד ולא להתמקד ב"אם עובד". -
@dovid כתב בעזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה:
cellEditorParams לא אמור למלאות את השורות, אלא לתת רשימת השלמה למילוי, אין לי מושג מה נתקעת על זה בשביל פונקציה לטעינת המידע.
אני אמור לתת לו רשימת השלמה, אז אני נותן לו פונקצייה שתחזיר לו רשימה כזו
@dovid כתב בעזרה|בשימוש ברשימה נפתחת ב ag grid הוא לא מחכה לערכים המוחזרים מפונקצייה:
לנסות להבין לאט לאט איך זה עובד
איך עובד JS או זה?
כי לענ"ד נראה שהפונקצייה עובדת טוב רק ה ag לא מחכה , ואם הוא לא מקבל מענה מיידי אז הוא מחזיר אין לו מידע, אז זה קשור לעבודת JS?