למה זה לא מצליח - JS

[ש.ב.ח.]

אני מנסה להשתמש בתכונה של אלמנט בעת שינוי (כפתורי רדיו)
וזה מחזיר לי ערך חסר undefind

זה הקוד:

function toListRegisterd(e){
    var selected = $(this).data('index');
    alert(selected);

החלון Alert קופץ עם הundefind

התכונה קיימת בוודאות ברכיב

data-index="1"

[יוסף בן שמעון]

@ש-ב-ח אמר בלמה זה לא מצליח - JS:

מי זה this?
אתה מצביע כנראה לאלמנט הלא נכון, מי קורא לפונקציה? אם זה מאירוע, אתה צריך לגשת ליעד של האירוע כך:

function toListRegisterd(e){
    var selected = $(e.target).data('index');
    alert(selected);
}

[yossiz]

@ש-ב-ח אם הבנתי נכון, פונקציית data של jquery לא בנוי לגמרי על מאפייני data של html.
עיין כאן: https://api.jquery.com/data/#data-html5 שאחרי הקריאה הראשונה ל-data על אלמנט כלשהו, לא תזוהו שינויים למאפייני data.

Since jQuery 1.4.3, data-* attributes are used to initialize jQuery data. An element's data-* attributes are retrieved the first time the data() method is invoked upon it, and then are no longer accessed or mutated (all values are stored internally by jQuery).

@יוסף-בן-שמעון אמר בלמה זה לא מצליח - JS:

אם זה מאירוע, אתה צריך לגשת ליעד של האירוע כך:

למה לא נכון להשתמש ב-this?
https://stackoverflow.com/questions/17665489/using-this-inside-an-event-handler

[dovid]

@ש-ב-ח תשנה ל

alert(this.attributes['data-index'].value);

או

alert(this.dataset.index);

תדווח אם זה עובד.

[ש.ב.ח.]

@dovid
הראשון לא עובד כלל
השני אותו דבר undefind

[dovid]

אז ההשערה שלי הייתה נכונה.
ההנחה של כל השאלה ("התכונה קיימת בוודאות ברכיב") לא נכונה.

[ש.ב.ח.]

@dovid

[dovid]

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

האמת שכיון שאני לא יודע מי ואיך קורא לפונקציה, אז @יוסף-בן-שמעון צודק לחלוטין שיש לנו פה שאלה מאוד חלקית.
יש לך עוד כיוון בדיקה (תדפיס עם console.log(this) את האלמנט ותראה מה הפלט), או שתראה לנו את קוד ההרשמה לאירוע.

[ש.ב.ח.]

@dovid
ברור לי שככל הנראה משהו חסר... אני רק צריך מישהו שיצביע לי עליו.
צירפתי את הקובץ עליו אני מנסה לבצע את ניסיונותי
ניסיון.html

בגדול אם אני זוכר טוב אני חושב שאתה מתחילת הדרך הדרכת אותי, ברכתי שלוחה... תודה רבה!

[ש.ב.ח.]

@dovid
זיהיתי את הבעיה.
האלמנט המועבר הוא העוטף ולא הinput עצמו...
תודה רבה
כבר אנסה לפתור...

[dovid]

@ש-ב-ח בדיוק!
אני מציע לך טיפ שיקל עליך את העבודה: במקום שתהיה שתקשר פונקציה כללית לאירועי השינוי של כלל הradio ובתוך הפונקציה תבדוק את ערך הdata-index,
תוכל להזניק פונקציה אישית לכל אחד, שתקרא לפונקציה הכללית עם ארגומנט עם הID המתאים:

input.on('change', function() { toListRegisterd(no); } );

ולשנות את הפונקציה:

function toListRegisterd(id){
    alert(id);
}

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

טיפ נוסף: תעבור לangularjs.

[ש.ב.ח.]

@dovid אמר בלמה זה לא מצליח - JS:

טיפ נוסף: תעבור לangularjs.

לאט... כדי לעבור צריך קודם להכיר את הדירה הראשונה...
לפי מה שהבנתי אנגולר היא לא קלה אז למה לקפוץ ישר למים העמוקים?

[dovid]

@ש-ב-ח אני ראיתי שאתה משתמש עם jQuery.
אז angularjs זה פשוט ספריה אחרת, והיא כן קלה מאוד, שטובה ממנה בהרבה (בשביל התוצאות המצופות).

נ.ב. שים לב שאנגולר בד"כ מתייחס לאנגולר 2+ שזה ממש מסובך, ואילו angularjs מתייחס לאנגולר 1 שזה ממש ספריה חמודה כמו jQuery.

[ש.ב.ח.]

@dovid
אני שומע...
ננסה להכניס לתוכנית הלימודים העצמאים....

בכל מקרה כרגע השתמשתי כך, זה בסדר?

function toListRegisterd(e){
  var selected = $(this.childNodes[1]).data('index');
    alert(selected);
 
}

[יוסף בן שמעון]

@yossiz אמר בלמה זה לא מצליח - JS:

למה לא נכון להשתמש ב-this?
https://stackoverflow.com/questions/17665489/using-this-inside-an-event-handler

לא הכרתי, תודה רבה