thr3ads.net - Rails spinoffs - Event.observe causes "handler has no properties"-error [May 2008]

If this information is useful, please help other people find it:
Share via:

mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org

2008-May-18 11:25 UTC

Event.observe causes "handler has no properties"-error

Hello,

I habe a problem with the following code (shortened):

var Songlist = {
  initialize: function() {
    img = document.createElement(''img'');
    [...]
    img.observe(''mouseover'', this.mouseover);
    $(''body'').insert(img);
  }
  mouseover: function() {
    this.src = ''anotherimage.gif'';
  }
}

Songlist.initialize();

Passing the image with my mouse I always get the error: "handler has
no properties"!
I would be happy if you gave me a tip, where what causes this error!

M. Hoffmann
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org

2008-May-18 11:31 UTC

head link

Re: Event.observe causes "handler has no properties"-error

OK, I really tried hard before I posted the above message, but sitting
on the toilet I found the mistake.
The code must look like that, than it works:

var Songlist = {
  initialize: function() {
    img = document.createElement(''img'');
    [...]
    img.observe(''mouseover'', Songlist.mouseover);
    $(''body'').insert(img);
  }
  mouseover: function() {
    this.src = ''anotherimage.gif'';
  }

}

Songlist.initialize();

On 18 Mai, 13:25,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
<mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:> Hello,
>
> I habe a problem with the following code (shortened):
>
> var Songlist = {
>   initialize: function() {
>     img = document.createElement(''img'');
>     [...]
>     img.observe(''mouseover'', this.mouseover);
>     $(''body'').insert(img);
>   }
>   mouseover: function() {
>     this.src = ''anotherimage.gif'';
>   }
>
> }
>
> Songlist.initialize();
>
> Passing the image with my mouse I always get the error: "handler has
> no properties"!
> I would be happy if you gave me a tip, where what causes this error!
>
> M. Hoffmann--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

T.J. Crowder

2008-May-18 13:32 UTC

head link

Re: Event.observe causes "handler has no properties"-error

Hi,

No, that code probably doesn''t do what you mean it to do -- your code
hooking the event:
> img.observe(''mouseover'', Songlist.mouseover);
...doesn''t preserve "this" (as we discussed in another
thread).
Consequently when this code gets called:
> mouseover: function() {
>   this.src = ''anotherimage.gif'';
> }
..."this" will be the window object, not an instance of Songlist.

It''s really worth stopping coding for a moment and reading up on how
"this" works in JavaScript.  I''ve pointed you to this blog
entry
before:
http://blog.niftysnippets.org/2008/04/you-must-remember-this.html

Additionally, Flanagan''s book will pay you back in time savings pretty
much any time you spend reading it:
http://www.oreilly.com/catalog/jscript5/
http://www.amazon.com/dp/0596101996

In terms of the actual problem with the above code, as with last time,
you want to use bindAsEventListener:
http://www.prototypejs.org/api/function/bindAsEventListener

Hope this helps,
--
T.J. Crowder
tj / crowder software / com
On May 18, 12:31 pm,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
<mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:> OK, I really tried hard before I posted the above message, but sitting
> on the toilet I found the mistake.
> The code must look like that, than it works:
>
> var Songlist = {
>   initialize: function() {
>     img = document.createElement(''img'');
>     [...]
>     img.observe(''mouseover'', Songlist.mouseover);
>     $(''body'').insert(img);
>   }
>   mouseover: function() {
>     this.src = ''anotherimage.gif'';
>   }
>
> }
>
> Songlist.initialize();
>
> On 18 Mai, 13:25,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:
> > Hello,
>
> > I habe a problem with the following code (shortened):
>
> > var Songlist = {
> >   initialize: function() {
> >     img = document.createElement(''img'');
> >     [...]
> >     img.observe(''mouseover'', this.mouseover);
> >     $(''body'').insert(img);
> >   }
> >   mouseover: function() {
> >     this.src = ''anotherimage.gif'';
> >   }
>
> > }
>
> > Songlist.initialize();
>
> > Passing the image with my mouse I always get the error: "handler
has
> > no properties"!
> > I would be happy if you gave me a tip, where what causes this error!
>
> > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

T.J. Crowder

2008-May-18 13:36 UTC

head link

Re: Event.observe causes "handler has no properties"-error

> ..."this" will be the window object, not an instance of Songlist.
Doh!  Sorry, I forgot, it won''t be window, it''ll be the img
element.
I keep forgetting that Prototype''s event hooking stuff will default
''this'' in the handler to the element on which the event
occurred.  My
bad, apologies.
--
T.J. Crowder
tj / crowder software / com

On May 18, 2:32 pm, "T.J. Crowder"
<tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> Hi,
>
> No, that code probably doesn''t do what you mean it to do -- your
code
> hooking the event:
>
> > img.observe(''mouseover'', Songlist.mouseover);
>
> ...doesn''t preserve "this" (as we discussed in another
thread).
> Consequently when this code gets called:
>
> > mouseover: function() {
> >   this.src = ''anotherimage.gif'';
> > }
>
> ..."this" will be the window object, not an instance of Songlist.
>
> It''s really worth stopping coding for a moment and reading up on
how
> "this" works in JavaScript.  I''ve pointed you to this
blog entry
> before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html
>
> Additionally, Flanagan''s book will pay you back in time savings
pretty
> much any time you spend reading
it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596101996
>
> In terms of the actual problem with the above code, as with last time,
> you want to use
bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener
>
> Hope this helps,
> --
> T.J. Crowder
> tj / crowder software / com
> On May 18, 12:31 pm,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:
> > OK, I really tried hard before I posted the above message, but sitting
> > on the toilet I found the mistake.
> > The code must look like that, than it works:
>
> > var Songlist = {
> >   initialize: function() {
> >     img = document.createElement(''img'');
> >     [...]
> >     img.observe(''mouseover'', Songlist.mouseover);
> >     $(''body'').insert(img);
> >   }
> >   mouseover: function() {
> >     this.src = ''anotherimage.gif'';
> >   }
>
> > }
>
> > Songlist.initialize();
>
> > On 18 Mai, 13:25,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:
> > > Hello,
>
> > > I habe a problem with the following code (shortened):
>
> > > var Songlist = {
> > >   initialize: function() {
> > >     img = document.createElement(''img'');
> > >     [...]
> > >     img.observe(''mouseover'', this.mouseover);
> > >     $(''body'').insert(img);
> > >   }
> > >   mouseover: function() {
> > >     this.src = ''anotherimage.gif'';
> > >   }
>
> > > }
>
> > > Songlist.initialize();
>
> > > Passing the image with my mouse I always get the error:
"handler has
> > > no properties"!
> > > I would be happy if you gave me a tip, where what causes this
error!
>
> > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org

2008-May-18 13:46 UTC

head link

Re: Event.observe causes "handler has no properties"-error

No problem. I read the texts you posted last time, so I think I now
know,
what "this" does :-)
This time I, of course,  wanted to "this" to be the img to easily
change
the source.

On 18 Mai, 15:36, "T.J. Crowder"
<tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> > ..."this" will be the window object, not an instance of
Songlist.
>
> Doh!  Sorry, I forgot, it won''t be window, it''ll be the
img element.
> I keep forgetting that Prototype''s event hooking stuff will
default
> ''this'' in the handler to the element on which the event
occurred.  My
> bad, apologies.
> --
> T.J. Crowder
> tj / crowder software / com
>
> On May 18, 2:32 pm, "T.J. Crowder"
<tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
> > Hi,
>
> > No, that code probably doesn''t do what you mean it to do --
your code
> > hooking the event:
>
> > > img.observe(''mouseover'', Songlist.mouseover);
>
> > ...doesn''t preserve "this" (as we discussed in
another thread).
> > Consequently when this code gets called:
>
> > > mouseover: function() {
> > >   this.src = ''anotherimage.gif'';
> > > }
>
> > ..."this" will be the window object, not an instance of
Songlist.
>
> > It''s really worth stopping coding for a moment and reading up
on how
> > "this" works in JavaScript.  I''ve pointed you to
this blog entry
> >
before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html
>
> > Additionally, Flanagan''s book will pay you back in time
savings pretty
> > much any time you spend reading
it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596...
>
> > In terms of the actual problem with the above code, as with last time,
> > you want to use
bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener
>
> > Hope this helps,
> > --
> > T.J. Crowder
> > tj / crowder software / com
> > On May 18, 12:31 pm,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:
> > > OK, I really tried hard before I posted the above message, but
sitting
> > > on the toilet I found the mistake.
> > > The code must look like that, than it works:
>
> > > var Songlist = {
> > >   initialize: function() {
> > >     img = document.createElement(''img'');
> > >     [...]
> > >     img.observe(''mouseover'',
Songlist.mouseover);
> > >     $(''body'').insert(img);
> > >   }
> > >   mouseover: function() {
> > >     this.src = ''anotherimage.gif'';
> > >   }
>
> > > }
>
> > > Songlist.initialize();
>
> > > On 18 Mai, 13:25,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:
> > > > Hello,
>
> > > > I habe a problem with the following code (shortened):
>
> > > > var Songlist = {
> > > >   initialize: function() {
> > > >     img = document.createElement(''img'');
> > > >     [...]
> > > >     img.observe(''mouseover'',
this.mouseover);
> > > >     $(''body'').insert(img);
> > > >   }
> > > >   mouseover: function() {
> > > >     this.src = ''anotherimage.gif'';
> > > >   }
>
> > > > }
>
> > > > Songlist.initialize();
>
> > > > Passing the image with my mouse I always get the error:
"handler has
> > > > no properties"!
> > > > I would be happy if you gave me a tip, where what causes
this error!
>
> > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

kangax

2008-May-18 16:47 UTC

head link

Re: Event.observe causes "handler has no properties"-error

img is declared globally which is not really good, try this:

var Songlist = {
  initialize: function() {
    this.img = $(document.createElement(''img''));
    this.img.observe(''mouseover'', Songlist.mouseover);
    $(''body'').insert(this.img);
  }
  mouseover: function() {
    this.src = ''anotherimage.gif'';
  }

}

Songlist.initialize();

- kangax

On May 18, 9:46 am,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
<mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:> No problem. I read the texts you posted last time, so I think I now
> know,
> what "this" does :-)
> This time I, of course,  wanted to "this" to be the img to easily
> change
> the source.
>
> On 18 Mai, 15:36, "T.J. Crowder"
<tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
> > > ..."this" will be the window object, not an instance of
Songlist.
>
> > Doh!  Sorry, I forgot, it won''t be window, it''ll be
the img element.
> > I keep forgetting that Prototype''s event hooking stuff will
default
> > ''this'' in the handler to the element on which the
event occurred.  My
> > bad, apologies.
> > --
> > T.J. Crowder
> > tj / crowder software / com
>
> > On May 18, 2:32 pm, "T.J. Crowder"
<tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
> > > Hi,
>
> > > No, that code probably doesn''t do what you mean it to do
-- your code
> > > hooking the event:
>
> > > > img.observe(''mouseover'',
Songlist.mouseover);
>
> > > ...doesn''t preserve "this" (as we discussed in
another thread).
> > > Consequently when this code gets called:
>
> > > > mouseover: function() {
> > > >   this.src = ''anotherimage.gif'';
> > > > }
>
> > > ..."this" will be the window object, not an instance of
Songlist.
>
> > > It''s really worth stopping coding for a moment and
reading up on how
> > > "this" works in JavaScript.  I''ve pointed you
to this blog entry
> > >
before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html
>
> > > Additionally, Flanagan''s book will pay you back in time
savings pretty
> > > much any time you spend reading
it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596...
>
> > > In terms of the actual problem with the above code, as with last
time,
> > > you want to use
bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener
>
> > > Hope this helps,
> > > --
> > > T.J. Crowder
> > > tj / crowder software / com
> > > On May 18, 12:31 pm,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:
> > > > OK, I really tried hard before I posted the above message,
but sitting
> > > > on the toilet I found the mistake.
> > > > The code must look like that, than it works:
>
> > > > var Songlist = {
> > > >   initialize: function() {
> > > >     img = document.createElement(''img'');
> > > >     [...]
> > > >     img.observe(''mouseover'',
Songlist.mouseover);
> > > >     $(''body'').insert(img);
> > > >   }
> > > >   mouseover: function() {
> > > >     this.src = ''anotherimage.gif'';
> > > >   }
>
> > > > }
>
> > > > Songlist.initialize();
>
> > > > On 18 Mai, 13:25,
"mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
>
> > > >
<mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:
> > > > > Hello,
>
> > > > > I habe a problem with the following code (shortened):
>
> > > > > var Songlist = {
> > > > >   initialize: function() {
> > > > >     img =
document.createElement(''img'');
> > > > >     [...]
> > > > >     img.observe(''mouseover'',
this.mouseover);
> > > > >     $(''body'').insert(img);
> > > > >   }
> > > > >   mouseover: function() {
> > > > >     this.src = ''anotherimage.gif'';
> > > > >   }
>
> > > > > }
>
> > > > > Songlist.initialize();
>
> > > > > Passing the image with my mouse I always get the error:
"handler has
> > > > > no properties"!
> > > > > I would be happy if you gave me a tip, where what
causes this error!
>
> > > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Rails spinoffs - May 2008 - Event.observe causes "handler has no properties"-error

Event.observe causes "handler has no properties"-error

Re: Event.observe causes "handler has no properties"-error

Re: Event.observe causes "handler has no properties"-error

Re: Event.observe causes "handler has no properties"-error

Re: Event.observe causes "handler has no properties"-error

Re: Event.observe causes "handler has no properties"-error