1. 1
2. 2
3. 3

• a
• b
• c

Modal Implementation

Add a Unique ID

To open a modal, you'll first need to add a button to a page. The button must be given a unique ID that describes what the button is for.

Adding Inline JavaScript

There are two important parts to the JavaScript snippet. First, you must get the modal button element by ID. Second, there's a click event listener that will call the appModal function.

Modify the Modal Content

modalHeader

modalHeader: '
Demo Header
',

The modal header can accept any HTML content. For instance, you can wrap header text in various header tags.

modalBody

modalBody: '
This is a demo modal.
',

You'll want to treat your modal body as a regular page. The modal content will need a container div, a row, and column divs.

modalFooter

modalFooter: 'Close Modal',

The modal footer is designed to hold buttons. As am example you can add a Close Modal button. The function passed to the onClick is what closes the modal.

modalStyle (optional)

Available modal styles include:

• 'modal-default'

• 'modal-info'

• 'modal-warning'

• 'modal-danger'

type

Available types include:

• 'modal-alert'

• 'modal-full'

• 'modal-overlay'

size

Available modal sizes include:

• 'modal-lg'