Nasrul Hazim Bin Mohamad

Bootstrap: Loading / Process Dialog

Jul
07
var app;
app = app || (function () {
    var process = $('<div id="process" class="modal hide fade" tabindex="-1" data-backdrop="static" data-keyboard="false"><div class="modal-header"><h3>Processing...</h3></div><div class="modal-body"><div class="progress progress-striped active"><div class="bar" style="width: 100%;"></div></div></div></div>');
    return {
        showProcess: function() {
            process.modal('show');
        },
        hideProcess: function () {
            process.modal('hide');
        },

    };
})();

Just call app.showProcess(); to display the process dialogue and call app.hideProcess(); to hide it.

Reference: http://dotnetspeak.com/2013/05/creating-simple-please-wait-dialog-with-twitter-bootstrap/comment-page-1

Leave a Reply

Your email address will not be published. Required fields are marked *

7 + 2 =