קבלת מערך מphp

[chagold]

עשיתי פונקציה בPHP שמחזירה מערך, ומשום מה אני לא מצליח לקבל את המערך בגישת קליינט (דרך הדפדפן). רק כשניגשים מתוך הקוד בשרת לקלאס אז אפשר לטפל בARRAY.
איך ניתן לקבל את המערך כקליינט?
נ.ב. המטרה לקבל את הפונקציה היא בJS.
תודה רבה

[clickone]

@chagold לכאורה אתה אמור להמיר אותו לJSON
הנה דוגמא
https://www.w3schools.com/js/js_json_php.asp

[dovid]

אתה לא חייב JSON, אבל אתה חייב תוכן "מת" (לאפוקי אובייקטי תכנות) בינארי או טקסטואלי.
אבל תשכח מבינארי, בתקשורת דפדפן-שרת מקובל לעבוד רק עם טקסט:
א. את הקומפקטיות של הבינארי משאירים לשרת האינטרנט ולדפדפן לעשות
ב. מרויחים קריאות וקלות דיבאג, ואי תלות בפלטפורמה או בטכנולוגיה (בדרך כלל פורמט קומפקטי די כובל לממירים שנכתבו עבורו).

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

[chagold]

כשאני מקבל אותו בJSON הוא נראה ככה :

 [{"id":"1","text":"copy.jpg"},{"id":"2","text":"copy.jpg"}]

אבל אני לא מצליח לקרוא אותו בJS. אולי כיון ששם המערכים נקראים ככה (בלי הגרשיים על שם השדה):

 {id: "1", text: "copy.jpg"}
 {id: "2", text: "copy.jpg"}

אני צודק? אם כן איך ממירים אותו?
תודה.

[dovid]

אתה טועה למחצה. הפורמט של JSON הוא JS תקין, אלא שאתה מקבל אותו כמחרוזת טקסט ולא כאובייקטי JS, ולכן אתה אכן צריך להמיר אותו.
זה מתבצע ע"י הפונקציה JSON.pars היא מקבלת טקסט ומחזירה את התוכן כאובייקטי JS:

JSON.parse('[{"id":"1","text":"copy.jpg"},{"id":"2","text":"copy.jpg"}]');

אתה צריך להעביר לה כארגומנט את התשובה שהPHP מחזיר.

[chagold]

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

הפונקציה היא כזו.

 function Listprofile() {  
var xhttp;
var grocerList = [];
xhttp = new XMLHttpRequest();

xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       grocerList = JSON.parse([this.responseText]) //השורה שמקבלת את התוצאה.          
    }       
};

xhttp.open("GET", "index.php?p="+'get_profiles&user=1', true);
xhttp.send(); 

return grocerList
         
}

[dovid]

הטעות שלך קשורה לאסינכרוניות של JS.
בJS, כל פעולה ממושכת, הקוד שאחריה מתבצע מיידית עוד לפני סיומה. ממילא בקוד שלך למשל השורה הxhttp.send() היא ממושכת, והשורה return grocerList, מתבצעת מיידית עוד לפניה!
האם זה אומר שאין סדר בJS? לא, כי באמת קודם מורץ הxhttp.send() אבל בתצורת "שגר ושכח".
אם ככה איך אתה יכול להשתמש בנתונים שחוזרים? רק ע"י העברה של הלוגיקה הנדרשת לקאלבאק. קלאבאק, זה כינוי לפונקציה שמתבצעת כשהתהליך ה"ארוך" נגמר.
במקרה שלך שמת שם הצבה לgrocerList. אז זהו שזה לא מספיק. עליך לשים שמה את כל מה שאתה רוצה שיקרה אז! זה נשמע מרתיע, אבל בהתחשב בעובדה שאתה יכול להעביר פונקציות כפרמטרים, זה נהיה לא לאט דרך חיים קלה - שהיא הרך היחידה בJavaScript.
למשל, אם אתה רוצה שבלחיצת כפתור יוצגו נתונים בJS, אתה תעשה משהו בסגנון:

var btn = document.getElementsByTagName("button")[0];


btn.addEventListener("click", function () {
    downloadData(addContentToHtml);
});

function addContentToHtml(content) {
    var asObj = JSON.parse(content);
    var div = document.getElementsByTagName("div")[0];
    for (var index in asObj) {
        var node = document.createElement("span");
        var textnode = document.createTextNode(asObj[index]);
        node.appendChild(textnode);
        div.appendChild(node);
    }

}

function downloadData(doAtEnd) {
    xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {
            doAtEnd(this.responseText);
            //document.getElementById("demo").innerHTML = this.responseText;
        }
    };
    xhttp.open("POST", "https://httpbin.org/post", true);
    xhttp.send();
}

מה שקורה בקוד זה שאני מעביר לפונקציה downloadData בפרמטר את פונקציית ההמשך (addContentToHtml) שתתרחש אחרי שפעולת הבקשה תסתיים.
הנה קוד לדוגמא: https://jsfiddle.net/098fc3ew/

[chagold]

למעשה הפונקציה לא מחזירה את הערך בRETURN אלא מיישמת את זה עצמאית בשטח.
אין אפשרות שהיא תחזיר אותו לפונקציה?

[dovid]

@chagold אמר בקבלת מערך מphp:

למעשה הפונקציה לא מחזירה את הערך בRETURN אלא מיישמת את זה עצמאית בשטח.
אין אפשרות שהיא תחזיר אותו לפונקציה?

לא מבין, תרחיב.
כמו כן תבדוק שהבנת טוב את הדוגמא שנתתי (אם לא, שאל!).

[chagold]

@dovid
בדוגמא שהבאת, הפונקציה addContentToHtml (שהיא פרמטר בdownloadData) מבצעת שינוי (בינדינג) על אלמנטים בHTML.
אני השתמשתי עם הדוגמא הזו בשביל שינוי של משתנים אחרים בJS.
השאלה איך אני במקום לעשות שינוי אני רק מקבל איזה פרמטר ונון אותו כערך לפונקציה עצמה, כדי שכשאני עושה

  var xx = fff(peremeter)

אז fff יהיה ערך אמיתי.

[dovid]

שים את ההשמה בפונקציית הקאלבק.
כלומר במקום שינוי בhtml תעשה השמה למשתנה.
אין דרך בJS, לקבל ערך מפעולה שאורכת זמן (מהסוגים האסינכרוניים, למעט למשל alert וכיוצ"ב) בלי להשתמש בקאלבק.