Create a Custom Alert and Confirmation Dialogue With PHP and JQuery

            
$(document).on('click', '.custom-alert-basic', function(e){
    e.preventDefault();
    customAlert();
});
            
        

            
$(document).on('click', '.custom-alert', function(e){
    e.preventDefault();
    
    let options  = {
        'heading' : 'A Custom Alert',
        'style' : 'success',
        'text' : 'You clicked a custom alert.'
    };
    customAlert(options);
});
            
        

            
$(document).on('click', '.custom-double-alert', function(e){
    e.preventDefault();
    
    let firstOptions  = {
        'heading' : 'A Double Alert',
        'style' : 'success',
        'text' : 'You clicked a custom alert.'
    };
    customAlert(firstOptions, '', function() {
        let secondOptions  = {
            'heading' : 'A second alert',
            'style' : 'info',
            'text' : "This is another alert. It can be a bit annoying but it's good for double and triple checking that a user is really, really sure they want to perform this action."
        };
        customAlert(secondOptions);
    });
});
            
        

            
$(document).on('click', '.custom-prompt', function(e){
    e.preventDefault();
    
    let promptOptions  = {
        'type' : 'prompt',
        'heading' : 'Type Something',
        'style' : 'info',
        'text' : 'So this a prompt which basically works like a form. When the user inserts the information and hits submit, you can do something with that information.'
    };
    customAlert(promptOptions, function() {
        let val = $('#prompt-input').val();
        
        if(!val.length) {
             let errorOptions  = {
                'type' : 'alert',
                'heading' : 'Please add a value.',
                'style' : 'danger',
                'text' : 'Please type some text in the prompt input.'
            };
            
             customAlert(errorOptions, '', function() {
                 customAlert(promptOptions);
             });
        }
        else {
            updateHtml(val, '.prompt-output');
        }
        
    });
});
            
        

            
$(document).on('click', '.custom-confirmation', function(e){
    e.preventDefault();
    
    let options  = {
        'type' : 'confirmation',
        'heading' : 'A Custom Confirmation',
        'style' : 'warning',
        'text' : 'Are you sure you want to do this.'
    };
    customAlert(options,
        function() {
            updateHtml('Confirmed :)', '.confirmation-output');

        },
        function() {
            // Optionally, do something on decline
            updateHtml('Declined :(', '.confirmation-output');
        }
    );
});