| Name | Type | Default |
|---|
|
cookies
|
Boolean
|
false
|
Sets or gets the cookies property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [cookies]="true">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
cookieOptions
|
DockingCookieOptions
|
{}
|
interface DockingCookieOptions { domain?: String; expires?: Number; } Sets or gets the cookieOptions property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [cookies]="true" [cookieOptions]="{ domain: 'jqwidgets.com', expires: 90 }">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
disabled
|
Boolean
|
false
|
Sets or gets the disabled property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [disabled]="true">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
floatingWindowOpacity
|
Number
|
0.3
|
Sets or gets the floatingWindowOpacity property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [floatingWindowOpacity]="0.4">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
height
|
Size
|
auto
|
Sets or gets the height property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [height]="300">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
keyboardNavigation
|
Boolean
|
false
|
Sets or gets the keyboardNavigation property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [keyboardNavigation]="true">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
mode
|
enum:DockingMode
|
default
|
enum DockingMode { default, docked, floating } Sets or gets the mode property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [mode]="'docked'">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
orientation
|
enum:DockingOrientation
|
horizontal
|
enum DockingOrientation { horizontal, vertical } Sets or gets the orientation property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [orientation]="'horizontal'">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
rtl
|
Boolean
|
false
|
Sets or gets the rtl property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [rtl]="true">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
theme
|
String
|
''
|
Sets or gets the theme property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [theme]="'energyblue'">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
width
|
Size
|
auto
|
Sets or gets the width property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [width]="300">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
windowsMode
|
DockingWindowsMode
|
null
|
interface DockingWindowsMode { windowID: DockingMode; } Sets or gets the windowsMode property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [windowsMode]="{ 'window0': 'floating', 'window1': 'docked' }">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
windowsOffset
|
Number
|
5
|
Sets or gets the windowsOffset property.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking [windowsOffset]="7">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
}
|
|
|
|
dragStart
|
Event
|
|
This event is triggered when the user start to drag any window.
Code examples
Bind to the dragStart event of jqxDocking.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking (onDragStart)="DragStart($event)">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
DragStart(event: any): void
{
// Do Something
}
}
|
|
dragEnd
|
Event
|
|
This event is triggered when the user drop any window.
Code examples
Bind to the dragEnd event of jqxDocking.
import { Component } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking (onDragEnd)="DragEnd($event)">
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent {
DragEnd(event: any): void
{
// Do Something
}
}
|
|
|
| Name | Return Type | Arguments |
|---|
|
addWindow
|
Void
|
windowId: String,
mode: Any,
panel: Number,
position: Any
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.addWindow();
}
}
|
|
closeWindow
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.closeWindow();
}
}
|
|
collapseWindow
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.collapseWindow();
}
}
|
|
destroy
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.destroy();
}
}
|
|
disableWindowResize
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.disableWindowResize();
}
}
|
|
disable
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.disable();
}
}
|
|
exportLayout
|
String
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
let value = this.myDocking.exportLayout();
}
}
|
|
enable
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.enable();
}
}
|
|
expandWindow
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.expandWindow();
}
}
|
|
enableWindowResize
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.enableWindowResize();
}
}
|
|
focus
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.focus();
}
}
|
|
hideAllCloseButtons
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.hideAllCloseButtons();
}
}
|
|
hideAllCollapseButtons
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.hideAllCollapseButtons();
}
}
|
|
hideCollapseButton
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.hideCollapseButton();
}
}
|
|
hideCloseButton
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.hideCloseButton();
}
}
|
|
importLayout
|
Void
|
Json: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.importLayout();
}
}
|
|
move
|
Void
|
windowId: String,
panel: Number,
position: Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.move();
}
}
|
|
pinWindow
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.pinWindow();
}
}
|
|
setWindowMode
|
Void
|
windowId: String,
mode: Any
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.setWindowMode();
}
}
|
|
showCloseButton
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.showCloseButton();
}
}
|
|
showCollapseButton
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.showCollapseButton();
}
}
|
|
setWindowPosition
|
Void
|
windowId: String,
top: Any,
left: Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.setWindowPosition();
}
}
|
|
showAllCloseButtons
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.showAllCloseButtons();
}
}
|
|
showAllCollapseButtons
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.showAllCollapseButtons();
}
}
|
|
unpinWindow
|
Void
|
windowId: String
|
import { Component, ViewChild, AfterViewInit } from "@angular/core";
@Component({
selector: "app-root",
template: `
<jqxDocking #myDocking >
<div>
<div id="window0" style="height: 150px">
<div>CISC</div>
<div>
Before the RISC philosophy became prominent.....
</div>
</div>
<div id="window1" style="height: 150px">
<div>Database management system</div>
<div>
A database management system (DBMS) is a software...
</div>
</div>
</div>
<div>
<div id="window2" style="height: 150px">
<div>RISC</div>
<div>
Some aspects attributed to the first RISC-labeled designs....
</div>
</div>
</div>
</jqxDocking>
`
})
export class AppComponent implements AfterViewInit {
@ViewChild('myDocking') myDocking: jqxDockingComponent;
ngAfterViewInit(): void
{
this.myDocking.unpinWindow();
}
}
|