Last active
August 29, 2015 14:21
-
-
Save kstover/58c5bf129d12b621df35 to your computer and use it in GitHub Desktop.
Ninja Forms - Using the NF Admin Modal to create custom admin modal dialogs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="custom-message" style="display:none;"> <!-- adding display:none; will keep the element from flashing on load. --> | |
<?php _e( 'This setting will COMPLETELY remove anything Ninja Forms related upon plugin deletion. This includes SUBMISSIONS and FORMS. It cannot be undone.', 'ninja-forms' ); ?> | |
</div> | |
<div class="custom-message-buttons" style="display:none;"> <!-- the buttons div defines the bottom of the modal.--> | |
<div id="nf-admin-modal-cancel"> <!-- nf-admin-modal-cancel is the class that aligns the button to the left. --> | |
<a class="submitdelete deletion modal-close" href="#">Cancel</a> | |
</div> | |
<div id="nf-admin-modal-update"> <!-- nf-admin-modal-update is the class that aligns the button to the right. --> | |
<a class="button-primary" href="#">Continue</a> | |
</div> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Instantiate the modal | |
*/ | |
$( '.custom-message' ).nfAdminModal( { title: 'My Modal Title', buttons: '.custom-message-buttons' } ); | |
/* | |
Open the modal | |
*/ | |
$( '.custom-message' ).nfAdminModal( 'open' ); | |
/* | |
Close the modal (Note that the "cancel" button and the X automatically close the modal) | |
*/ | |
$( '.custom-message' ).nfAdminModal( 'close' ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment