views:

23

answers:

2

I have a a set of yui buttons generated using the standard yui html.

<span class="yui-button yui-checkbox-button" id="analystbutton1">
    <span class="first-child">
        <button type="button" class="facetbutton" tabindex="0" id="analystbutton1-button">
            Joe Bloggs
        </button>
    </span>
</span>

I create the buttons like so, and I then have some javascript to create the button and the listener.

var analystCButton1 = new YAHOO.widget.Button("analystbutton1", { type:"checkbox", value:"BLOGGS", checked:false }); 
analystCButton1.on("click", onFacetClick);

Finally I have the onFacetClick function

var onFacetClick = function (e) { // e is the event
 var target = YAHOO.util.Event.getTarget(e);
 var button = new YAHOO.widget.Button(target);
 alert(button.get('type'));
 alert(button.get('id'));
 alert(button.get('value'));
};

When I click on any of my buttons the first two alerts display the type and id (although not what I would expect). I cannot get the value, the alert doesn't fire, but I see no error in FireBug or the error console.

alert(button.get('type')); returns push - I would expect checkbox alert(button.get('id')); returns analystbutton1-button

A: 

So it turns out my function should be simpler -

var onFacetClick = function (e) { // e is the event
       alert(e.get("value")); 
};

I'd like to know what the difference is between e.getTarget() and the event e ?

e.getTarget was returning a HTMLButtonElement

Simon
A: 

e.getTarget() would return the HTML node which was the target of the event.

the event e is the event object itself, which includes things like the type of the event, the time of the event etc. You can do console.log(e) to see all the things that the event object encapsulates.

unomi
Thanks for the pointer on console.log(e)
Simon