Hi,

> Isn't this the one case where bindAsEventListener() is actually
> needed?

No, more here:
http://proto-scripty.wikidot.com/prototype:tip-you-probably-don-t-need-bindaseventlistener

...but Matt was mistaken when he said the argument would show up after
the event. When you use #bind, the event argument is always after the
curried arguments:

this.handler = function(message, event) { // <== Note curried arg is
first
    alert("The curried argument is: " + message);
    event.stop();
}
$('foo').observe('click', this.handler.bind(this, 'some message'));

When the foo element is clicked, it will alert "The curried argument
is: some message" and stop the event.

If you use #bindAsEventListener, the event argument will always be the
first argument, followed by any curried args:

this.handler = function(event, message) { // <== Note the change
    alert("The curried argument is: " + message);
    event.stop();
}
$('foo').observe('click', this.handler.bindAsEventListener(this,
'bar'));

Which you use is up to you. I recommend always using one or the
other. :-)

HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com


On Aug 4, 5:15 pm, Eric <lefauv...@gmail.com> wrote:
> On Jul 23, 10:14 pm, Matt Foster <mattfoste...@gmail.com> wrote:
>
> > You can just add parameters to the bind call and they will show up in
> > execution.
>
> > $(id).observe('mousedown', this.myFunction.bind(this, otherParam);
>
> > Then I believe it shows up after the event.
>
> Isn't this the one case where bindAsEventListener() is actually
> needed?
>
> (or perhaps I am all wrong again :o) ).
>
> Eric
>
>
>
>
>
> > function myFunction(event, param){...
>
> > but in your case, simply binding to "this" will allow you to reference
> > the instance's ID and all other properties associated with the class
> > instance and you shouldn't have to basically curry extra parameters to
> > the event listener.
>
> > --
>
> >http://positionabsolute.net
>
> > On Jul 23, 2:48 pm, "T.J. Crowder" <t...@crowdersoftware.com> wrote:
>
> > > Hi,
>
> > > Since you're creating the event handler inside your `initialize`
> > > function, you can take advantage of the fact it's already a closure by
> > > assigning `this` to a local variable (`self` is a common name for it)
> > > and then using `self` within the closure (the event handler), since it
> > > will inherit it.
>
> > > Here's an example (with a few other things cleaned up as well, I've
> > > included comments):
>
> > > initialize: function(id,name,top,left){
> > >     var self = this; // Keep a reference to the instance for use below
> > >     try{
> > >         this.id = id;
> > >         this.name = name;
> > >         this.currentTop = top;
> > >         this.currentLeft = left;
> > >         // Use `observe`, not `addEventListener`, for IE support
> > >         $(id).observe("mousedown", function(event) {    // `event` not
> > > `this.id`
> > >             // Throughout, use `self` to refer to the instance
> > >             alert(self.id);
> > >             self.myFunction(self.id);
> > >         }); // No `false` needed with `observe`
> > >     }
> > >     catch(error){alert(error);}
>
> > > },
>
> > > Alternately, if you don't like using `self`, or if the function you
> > > want to use is already defined somewhere, you can use Prototype's
> > > Function#bind. #bind creates a closure for you behind the scenes that
> > > will turn around and call the original function such that `this` is
> > > set correctly:
>
> > > initialize: function(id,name,top,left){
> > >     try{
> > >         this.id = id;
> > >         this.name = name;
> > >         this.currentTop = top;
> > >         this.currentLeft = left;
> > >         // Use `observe`, not `addEventListener`, for IE support
> > >         $(id).observe("mousedown", (function(event) {   // `event` not
> > > `this.id`
> > >             alert(this.id);
> > >             this.myFunction(this.id);
> > >         }).bind(this)); // Note the `bind` (and as above, no `false`
> > > needed with `observe`)
> > >     }
> > >     catch(error){alert(error);}
>
> > > },
>
> > > More on closures 
> > > here:http://blog.niftysnippets.org/2008/02/closures-are-not-complicated.html
>
> > > More on `this` and how it's not the same in JavaScript as in some
> > > other 
> > > languages:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html
>
> > > More on binding 
> > > here:http://api.prototypejs.org/language/function/prototype/bind/http://pr......
>
> > > HTH,
> > > --
> > > T.J. Crowder
> > > Independent Software Consultant
> > > tj / crowder software / comwww.crowdersoftware.com
>
> > > On Jul 23, 6:16 pm, Doc Torbin <mtor...@gmail.com> wrote:
>
> > > > I am working on a class now and part of the initialization is adding
> > > > event listeners to an object.  I'd like to pass some value through to
> > > > the functions that are attributes of the class but I can't seem to
> > > > figure it out.  Here's a sample piece of the code:
>
> > > > var MyClass= new Class.create();
> > > > MyClass.prototype = {
> > > >         initialize: function(id,name,top,left){
> > > >                 try{
> > > >                         this.id = id;
> > > >                         this.name = name;
> > > >                         this.currentTop = top;
> > > >                         this.currentLeft = left;
>
> > > >                         
> > > > $(id).addEventListener("mousedown",function(this.id){
> > > >                                 alert(this.id);
> > > >                                 this.myFunction(this.id);
> > > >                         },false);
>
> > > >                 }
> > > >                 catch(error){alert(error);}
> > > >         },
> > > >         myFunction:function(event){
> > > >                 this.mouseState++;
> > > >                 $('status').innerHTML = "The object has been picked up. 
> > > > ||
> > > > mouseState is " + this.mouseState;
> > > >         }
>
> > > > };
>
> > > > Any suggestions would be much appreciated.
>
> > > >  - MT

-- 
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-scriptacul...@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.

Reply via email to