[Proto-Scripty] Re: Class with Ajax and onclick event
Thank you for the response. You're right, I declared another variable and now it works fine. I have two other problems, though: I can't pass an aditional argument to the event handler(changeContent) and I can't figure out how can I make the content change automatic... On Aug 5, 11:33 am, ColinFine colin.f...@pace.com wrote: On Aug 4, 2:24 pm, Liviu Timar mailti...@gmail.com wrote: var Dynamic = Class.create({ initialize: function(selector, container, script) { this.selector = selector; this.script = script; this.container = container; this.changeContent = this.changeContent.bindAsEventListener(this); this.getContent(); }, getContent: function() { new Ajax.Request(this.script, { onSuccess: function(req) { this.content = req.responseJSON; This is ths problem. Inside the function definition, there is a new scope, and 'this' will not have been assigned (because callbacks don't get called as methods). Either you need to #bind your onSuccess function, or I would just use another variable: getContent: function() { var that = this; onSuccess: function(req) { that.content = req.responseJSON; ... --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Class with Ajax and onclick event
Sorry, I forgot to specify. This is the code: getContent: function() { var dyn = this; new Ajax.Request(this.script, { onSuccess: function(req) { dyn.content = req.responseJSON; document.fire('content:retrieved', req.responseJSON); } }); //$$(this.selector).invoke('observe', 'click', this.changeContent.bind(this)); $$(this.selector).each(function(element, index) { element.observe('click', dyn.changeContent.bind(dyn)); }); } I want to pass the index as an extra argument to dyn.changeContent, because I want to know which of the links was clicked. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Class with Ajax and onclick event
I figured it out. I understand that the extra argument will be null because it doesn't exist when the link is being clicked. The solution I found was to make my own attribute count for the a element: a href= count=#number. This attribute can be read by using readAttribute in the changeContent function. After I will figure out how to make the content change automatically (to simulate the clicking on 1 2 3 4 5 6) I will post here the finished class. Maybe it can be used by JS beginners like me to do something similar or maybe someone will use in this form. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Class with Ajax and onclick event
Hello, This is my first post here. Thus, I'll like to say hello to everybody in this community and I want to appologize if this question was asked before. I am a web developer for a site that has 1mil+ visitors/month: www [dot] ziare [dot] ro, and I want to use the Prototype Framework to make an element refresh itself (with an scriptaculous Effect) periodically. This is my class: var Dynamic = Class.create({ initialize: function(selector, container, script) { this.selector = selector; this.script= script; this.container = container; this.changeContent = this.changeContent.bindAsEventListener(this); this.getContent(); }, getContent: function() { new Ajax.Request(this.script, { onSuccess: function(req) { this.content = req.responseJSON; //document.fire('content:retrieved', req.responseJSON); } }); $$(this.selector).invoke('observe', 'click', this.changeContent.bind (this)); }, changeContent: function(event) { event.preventDefault(); console.log(this.content); console.log(this.container); /*new Effect.Fade($(this.container), { afterFinish: function() { new Effect.Appear($(this.container)); } }); $(this.container).update('cucu');*/ } }); document.observe('dom:loaded', function() { var dyn = new Dynamic(.tzNavLink a, tzContent, titlurileZilei.php); }); 'tzContent' is the div whose content changes by clicking on of the links with the 'tzNavLink' css class (the 1 2 3 4 5 6 links on www.ziare.ro). The problem is that this.content is undefined in changeContent (a function that listens for the click event), although this.container works well in the same function. Why is that? It has something to do with the Ajax.Request? Also, I want to ask how can I 'tzContent' to change periodically using such and object (I want everything to be encapsulated so I can use this object in other projects)? Thank you for your response. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---