Access to componente within event handler

[pwenkParticipant]

I have multiple jqxDropDownList in the same HTML template. All of them binds to the same event handler. They must have the same behavior.

<jqxDropDownList #my1 (onChange)=’onOpenEvent($event)’ [width]=’200′ [height]=’25’ [source]=’source1’ [selectedIndex]=’1′></jqxDropDownList>
<jqxDropDownList #my2 (onChange)=’onOpenEvent($event)’ [width]=’200′ [height]=’25’ [source]=’source2’ [selectedIndex]=’1′></jqxDropDownList>
<jqxDropDownList #my3 (onChange)=’onOpenEvent($event)’ [width]=’200′ [height]=’25’ [source]=’source3’ [selectedIndex]=’1′></jqxDropDownList>

Each of them has a view child definition in the @Component Part

@ViewChild(“my1”) myDropDownList1 : jqxDropDownListComponent;
@ViewChild(“my2”) myDropDownList2 : jqxDropDownListComponent;
@ViewChild(“my3”) myDropDownList3 : jqxDropDownListComponent;

onOpenEvent(event: any): void
{
can we determine the component which triggered the event ?

I want to do something like that

this.myDropDownList1.uncheckAll();

but the component should be derived from the event controlblock

event????.uncheckAll()

}

[Ivo ZhulevParticipant]

Hi pwenk,

You can’t get the template variable from the event(#my1,#my2..).
But there are ways to do the thing you want, for example:

1) give each dropdownlist some class and determine by it
2) if you don`t need the event data you can pass some custom things and check by them:
`(onChange)=’onOpenEvent(‘my1’)

onOpenEvent(event: string): void {
if(event === ‘my1’) { ….. }
{
`
Ofcourse there are many other ways to do this, just distinguish them with something you can get from the event variable.

Best Regards,
Ivo

jQWidgets Team
http://www.jqwidgets.com/

[Ivo ZhulevParticipant]

Hi pwenk,

Another easy way is to use elementRef

<jqxDropDownList #my1 (onChange)=’onOpenEvent($event)’ [width]=’200′ [height]=’25’ [source]=’source1’ [selectedIndex]=’1′></jqxDropDownList>

@ViewChild('my1') my1: jqxDropDownListComponent

onOpenEvent(event: any): void {
    if(event.target == this.my1.elementRef.nativeElement.firstChild) { ... }
}

Best Regards,
Ivo

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts