[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!

[steffnParticipant]

Hi Ivo,
thanks i just updated for the latest version.

But i get this ERR all the time:

ERROR TypeError: a(...)[c] is not a function
    at Object.createInstance (eval at webpackJsonp.5.module.exports (addScript.js:9), <anonymous>:8:17924)
    at jqxDropDownButtonComponent.createComponent (angular_jqxdropdownbutton.ts:111)
    at jqxDropDownButtonComponent.ngOnInit (angular_jqxdropdownbutton.ts:48)
    at checkAndUpdateDirectiveInline (core.es5.js:10834)
    at checkAndUpdateNodeInline (core.es5.js:12330)
    at checkAndUpdateNode (core.es5.js:12269)
    at debugCheckAndUpdateNode (core.es5.js:13130)
    at debugCheckDirectivesFn (core.es5.js:13071)
    at Object.eval [as updateDirectives] (Layer1Component.html:4)
    at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13056)

The Error points on my injector in my app.component.html:

<div>
  <app-layer1></app-layer1>
</div>

And with the layer1 component i want to inject the jqwidget tree.
layer1.component.ts:

import { Component, ViewChild } from '@angular/core';

import { jqxTreeComponent } from '../../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxtree';
import { jqxDropDownButtonComponent } from '../../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxdropdownbutton';

@Component({
  selector: 'app-layer1',
  templateUrl: './layer1.component.html',
  styleUrls: ['./layer1.component.css']
})

export class Layer1Component {
  @ViewChild('myTree') myTree: jqxTreeComponent;
  @ViewChild('myDropDownButton') myDropDownButton: jqxDropDownButtonComponent;

  myTreeOnInitialized(): void {
    this.myDropDownButton.setContent('<div style="position: relative; margin-left: 3px; margin-top: 4px;">Home</div>');
  }

  myTreeOnSelect(event: any): void {
    let item = this.myTree.getItem(event.args.element);
    let dropDownContent = '<div style="position: relative; margin-left: 3px; margin-top: 4px;">' + item.label + '</div>';
    this.myDropDownButton.setContent(dropDownContent);
  }
}

By debugging in Webstorm i get the Error from this line in the layer1.component.ts:

this.myDropDownButton.setContent('<div style="position: relative; margin-left: 3px; margin-top: 4px;">Home</div>');

Thank you very much!

[steffnParticipant]

Sorry, too stupid.

i solved the issue…
I used the the same typescript file twice.

[steffnParticipant]

Hi,
i am using jQWidgets v4.5.3 (2017-June). But recieve this ERR by including the jqx navigationbar in my project:

ERROR in /home/steffen/WebstormProjects/jqwidgets-ts/jqwidgets.d.ts (14,18): Duplicate identifier 'widget'.

ERROR in /home/steffen/WebstormProjects/TestMenue/node_modules/jqwidgets-framework/jqwidgets-ts/jqwidgets.d.ts (18,18): Duplicate identifier 'widget'.

Could you please help me?
I thought the ERR was fixed by v4.5.3 ?
Thanks!

[steffnParticipant]

import {Component, ViewChild, AfterViewInit, ViewContainerRef, ComponentFactoryResolver} from '@angular/core';

// import { NewWindowServiceService } from  './new-window-service.service';

import { jqxWindowComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxwindow';
import { jqxButtonComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxbuttons';
import { jqxCheckBoxComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxcheckbox';
import { jqxTabsComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxtabs';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.neu.html'
})
export class AppComponent implements AfterViewInit
{

  //Funktion Add

  //constructor (private newService: NewWindowServiceService) {}

  @ViewChild('windowReference') window: jqxWindowComponent;
  @ViewChild('mainDemoReference') mainContainer: ViewContainerRef;

  constructor(private resolver: ComponentFactoryResolver) {}

  ngAfterViewInit(): void
  {
    setTimeout(() =>
    {
      this.window.focus();
    });
  }
  onResizeCheckBox(event: any): void
  {
    if (event.args.checked)
    {
      this.window.resizable(true);
    }
    else
    {
      this.window.resizable(false);
    }
  }
  onDragCheckBox(event: any): void
  {
    if (event.args.checked)
    {
      this.window.draggable(true);
    }
    else
    {
      this.window.draggable(false);
    }
  }
  onShowButton(): void
  {
    this.window.open();
  }
  onHideButton(): void
  {
    this.window.close();
  }
  onNewButton(): void {
    const factory = this.resolver.resolveComponentFactory(jqxWindowComponent);
    this.mainContainer.createComponent(factory);
  }

}

[Author]

Posts