Toolkit
TK.Popup
{
_: "button",
innerHTML: "Open popup",
onclick: function() {
this.Add({
_: TK.Popup,
Title: "Example Title",
EnableCloseButton: true, // Default: True
EnableBackDrop: true, // Default: false
EnableResize: true, // Default: true
Width: 500,
Height: 250,
Template: {
innerHTML: "This is the popup contents"
}
});
}
}
Popup with button bar
{
_: "button",
innerHTML: "Open popup 2",
onclick: function() {
this.Add({
_: TK.Popup,
Title: "Example Title",
EnableCloseButton: true, // Default: True
EnableBackDrop: true, // Default: false
EnableResize: true, // Default: true
Width: 500,
Height: 250,
Template: {
innerHTML: "This is the popup contents"
},
Buttons: {
Apply: function() {
return !confirm("Apply changes and close popup?");
},
Cancel: {
Text: "Close this popup!",
Click: function() {
alert('Button pressed');
}
}
}
});
}
}
Popup with ability to close by pressing ESC or clicking on the backdrop
{
_: "button",
innerHTML: "Open popup",
onclick: function() {
this.Add({
_: TK.Popup,
Title: "Example Title",
EnableCloseButton: true, // Default: True
EnableBackDrop: true, // Default: false
EnableResize: true, // Default: true
CloseWithEscapeButton: true, // Default: false
CloseByClickingOutsideOfPopup: true, // Default: false
Width: 500,
Height: 250,
Template: {
innerHTML: "This is the popup contents"
}
});
}
}