http://phptransformer.net/hosting/assets/js/AjaxModal.js

1/*!
2 * WHMCS Ajax Driven Modal Framework
3 *
4 * @copyright Copyright (c) WHMCS Limited 2005-2015
5 * @license http://www.whmcs.com/license/ WHMCS Eula
6 */
7jQuery(document).ready(function(){
8    jQuery('.open-modal').click(function(e) {
9        e.preventDefault();
10        var url = jQuery(this).attr('href'),
11            modalSize = jQuery(this).data('modal-size'),
12            modalTitle = jQuery(this).data('modal-title'),
13            submitId = jQuery(this).data('btn-submit-id'),
14            submitLabel = jQuery(this).data('btn-submit-label');
15
16        openModal(url, '', modalTitle, modalSize, submitLabel, submitId);
17    });
18
19    // define modal close reset action
20    jQuery('#modalAjax').modal('hide').on('hidden', function(){
21        jQuery('#modalAjax').find('.modal-body').empty();
22        jQuery('#modalAjax').children('div[class="modal-dialog"]').removeClass('modal-lg');
23        jQuery('#modalAjax .modal-title').html('Title');
24        jQuery('#modalAjax .modal-submit').html('Submit');
25        jQuery('#modalAjax .modal-submit').removeAttr('id');
26        jQuery('#modalAjax .loader').show();
27    });
28});
29
30function openModal(url, postData, modalTitle, modalSize, submitLabel, submitId) {
31
32    //set the text of the modal title
33    jQuery('#modalAjax .modal-title').html(modalTitle);
34
35    // set the modal size via a class attribute
36    if (modalSize) {
37        jQuery('#modalAjax').children('div[class="modal-dialog"]').addClass(modalSize);
38    }
39
40    // set the text of the submit button
41    if(!submitLabel){
42       jQuery('#modalAjax .modal-submit').hide();
43    } else {
44        jQuery('#modalAjax .modal-submit').show().html(submitLabel);
45        // set the button id so we can target the click function of it.
46        if (submitId) {
47            jQuery('#modalAjax .modal-submit').attr('id', submitId);
48        }
49    }
50
51    // show modal
52    jQuery('#modalAjax').modal('show');
53
54    // fetch modal content
55    jQuery.post(url, postData, function(data) {
56        updateAjaxModal(data);
57    }, 'json').fail(function() {
58        jQuery('#modalAjax .modal-body').html('An error occurred while communicating with the server. Please try again.');
59        jQuery('#modalAjax .loader').fadeOut();
60    });
61
62    //define modal submit button click
63    if (submitId) {
64        jQuery('#' + submitId).on('click', function() {
65            var modalForm = jQuery('#modalAjax').find('form');
66            jQuery('#modalAjax .loader').show();
67            jQuery.post(modalForm.attr('action'), modalForm.serialize(),
68                function(data) {
69                    updateAjaxModal(data);
70                }, 'json').fail(function() {
71                    jQuery('#modalAjax .modal-body').html('An error occurred while communicating with the server. Please try again.');
72                    jQuery('#modalAjax .loader').fadeOut();
73                }
74            );
75        })
76    }
77}
78
79function updateAjaxModal(data) {
80    if (data.dismiss) {
81        jQuery('#modalAjax').modal('hide');
82    }
83    if (data.successMsg) {
84        jQuery.growl.notice({ title: data.successMsgTitle, message: data.successMsg });
85    }
86    if (data.title) {
87        jQuery('#modalAjax .modal-title').html(data.title);
88    }
89    if (data.body) {
90        jQuery('#modalAjax .modal-body').html(data.body);
91    }
92    if (data.submitlabel) {
93        jQuery('#modalAjax .modal-submit').html(data.submitlabel);
94    }
95    jQuery('#modalAjax .loader').fadeOut();
96}
97
98// backwards compat for older dialog implementations
99
100function dialogSubmit() {
101    jQuery('#modalAjax .loader').show();
102    jQuery.post('', jQuery('#modalAjax').find('form').serialize(),
103        function(data) {
104            updateAjaxModal(data);
105        }, 'json').fail(function() {
106            jQuery('#modalAjax .modal-body').html('An error occurred while communicating with the server. Please try again.');
107            jQuery('#modalAjax .loader').fadeOut();
108        });
109}
110
111function dialogClose() {
112    jQuery('#modalAjax').modal('hide');
113}