okPopup

Last updated
Save as PDF

cdf .dashboard .Popups.okPopup

Static

The Ok Popup object containing the default values for a success notification popup.

On button click, the Popup is closed.

Source: dashboard/Popups.js, line 49

Example

<div class='cdfPopup'>
 <div class='cdfPopupHeader'>Title</div>
 <div class='cdfPopupBody'>
 <div class='cdfPopupDesc'>Description Text</div>
 <div class='cdfPopupButton'>Button Text</div>
 </div>
</div>

Members

Name	Description
$el : `jQuery`	The DOM element which holds the popup's content.
defaults : `Object`	The Popup default properties.
template : `String`	The template of the Popup.

Methods

Name	Description
hide()	Hides the popup.
render(newOpts)	Renders the Popup.
show(opts)	Shows the popup.

Members Details

$el: `jQuery`
The DOM element which holds the popup's content. Source: dashboard/Popups.js, line 105

$el: jQuery

The DOM element which holds the popup's content.

Source: dashboard/Popups.js, line 105

defaults: Object

The Popup default properties, with the properties applied during the template render.

Properties:
Name	Default Value	Description
header : `String`	Title	The header of the popup.
desc : `String`	Description Text	The description of the popup.
button : `String`	Button Text	The text on the button used to close the popup.
callback : `function`		Callback function executed when the button is clicked.

Source: dashboard/Popups.js, line 91

template: `String`
The Mustache template of the Ok Popup. It has a header, a description and a button. The default values for each of the template variables are stored in `defaults` `object`. Source: dashboard/Popups.js, line 74 Code <div class='cdfPopup'> <div class='cdfPopupHeader'>{{{header}}}</div> <div class='cdfPopupBody'> <div class='cdfPopupDesc'>{{{desc}}}</div> <div class='cdfPopupButton'>{{{button}}}</div> </div> </div>

template: String

The Mustache template of the Ok Popup.

It has a header, a description and a button. The default values for each of the template variables are stored in defaults object.

Source: dashboard/Popups.js, line 74

Code

<div class='cdfPopup'>
 <div class='cdfPopupHeader'>{{{header}}}</div>
 <div class='cdfPopupBody'>
 <div class='cdfPopupDesc'>{{{desc}}}</div>
 <div class='cdfPopupButton'>{{{button}}}</div>
 </div>
</div>

Methods Details

hide()
Hides the popup, based on the `$el` element. Source: dashboard/Popups.js, line 125

hide()

Hides the popup, based on the $el element.

Source: dashboard/Popups.js, line 125

render(newOpts)

Renders the Popup based on the object containing the properties to apply to the Mustache template.

When the component is rendered, it gets hidden and appended to the body.

Source: dashboard/Popups.js, line 138

Parameters:
Name	Default Value	Summary
newOpts : `Object` Optional		Options object used to extend the `defaults` `object`. This is used to assign values to the properties which define the content of the component.

show(opts)

Shows the popup based on the $el object.

If the popup is rendering for the first time or if show is called with the opts parameter, then the render is called.

Source: dashboard/Popups.js, line 114

Parameters:
Name	Default Value	Summary
opts : `Object` Optional		Options object used to call the render.

cdf.dashboard.Popups.okPopup

Example

Members

Methods

Code

cdf .dashboard .Popups.okPopup