Bind "click" event on jqxWindow close button

[steffnParticipant]

HI,
i am using the jqxWindow widget in my app with angular 4.
i want to bind an external clickEvent on the close button (on the right top corner).
How could i realize this in angular 4?
Thanks a lot for any ideas!

[Ivo ZhulevParticipant]

Hi steffn,

Well, when you click the close button the close event of the jqxWindow is called where you can make your magic.
If that won’t help you, please provide me with some details about what outcome you desire.

Best Regards,
Ivo

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

[steffnParticipant]

Thanks Ivo,

i am using the jqxWindow dynamicly and several times in my application.
I want to use one function to trigger an event by closing the window.
This is my DataWindow.html:

<jqxWindow [width]="600" [height]="400" [closeButtonAction]="'close'">
  <div id="windowHeader1">
                <span>
                    Data Window
                </span>
  </div>
  <div style="overflow: hidden;" id="windowContent1" >
    <div>
      <app-addmqtt></app-addmqtt>
      <app-gauge></app-gauge>
    </div>
  </div>
</jqxWindow>

And this my DataWindow.ts:

import {Component, Input, OnInit} from '@angular/core';
import {AddmqttService} from './addmqtt/formmqtt/addmqtt.service';
//import {ClassdataproviderService} from './../classdataprovider.service';

@Component({
  selector: 'app-datawindow',
  templateUrl: './datawindow.component.html',
  // providers: [AddmqttService],
  styleUrls: ['./datawindow.component.css']
})
export class DatawindowComponent   {

  constructor(private addmqttService: AddmqttService) {}

  WindowCloseButtonAction () {
   
  }

}

How could i bind a function on the close button, because there is no obvious close funtion?
Thanks a lot!

[Ivo ZhulevParticipant]

Hi steffn,

If I understood you right:

<jqxWindow [width]="600" [height]="400" [closeButtonAction]="'close'" (onClose)="WindowCloseButtonAction($event)">
  <div id="windowHeader1">
                <span>
                    Data Window
                </span>
  </div>
  <div style="overflow: hidden;" id="windowContent1" >
    <div>
      <app-addmqtt></app-addmqtt>
      <app-gauge></app-gauge>
    </div>
  </div>
</jqxWindow>

Best Regards,
Ivo

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

[Author]

Posts