diff options
| author | Nick Veys <[email protected]> | 2011-09-17 14:47:38 -0500 |
|---|---|---|
| committer | Nick Veys <[email protected]> | 2011-09-17 15:08:16 -0500 |
| commit | 2cb233319da422c9f003e8687d686e96a92be489 (patch) | |
| tree | 99622a861da1dc4bc0905f1fe6055fc10f630d45 | |
| parent | 732ff9ed1c0b590c17951de412024cb7acd5763a (diff) | |
| download | bootstrap-2cb233319da422c9f003e8687d686e96a92be489.tar.xz bootstrap-2cb233319da422c9f003e8687d686e96a92be489.zip | |
Adding flag to prevent backdrop click hiding modal
| -rw-r--r-- | docs/javascript.html | 6 | ||||
| -rw-r--r-- | js/bootstrap-modal.js | 7 | ||||
| -rw-r--r-- | js/tests/unit/bootstrap-modal.js | 64 |
3 files changed, 74 insertions, 3 deletions
diff --git a/docs/javascript.html b/docs/javascript.html index f001ad808..e0d85f25a 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -106,6 +106,12 @@ <td>Includes a modal-backdrop element</td> </tr> <tr> + <td>backdropClickHides</td> + <td>boolean</td> + <td>true</td> + <td>A click on the modal-backdrop element hides the modal</td> + </tr> + <tr> <td>keyboard</td> <td>boolean</td> <td>false</td> diff --git a/js/bootstrap-modal.js b/js/bootstrap-modal.js index da6706073..98e5d4301 100644 --- a/js/bootstrap-modal.js +++ b/js/bootstrap-modal.js @@ -133,8 +133,10 @@ , animate = this.$element.hasClass('fade') ? 'fade' : '' if ( this.isShown && this.settings.backdrop ) { this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />') - .click($.proxy(this.hide, this)) - .appendTo(document.body) + if ( this.settings.backdropClickHides ) { + this.$backdrop.click($.proxy(this.hide, this)) + } + this.$backdrop.appendTo(document.body) setTimeout(function () { that.$backdrop && that.$backdrop.addClass('in') @@ -208,6 +210,7 @@ $.fn.modal.defaults = { backdrop: false + , backdropClickHides: true , keyboard: false , show: true } diff --git a/js/tests/unit/bootstrap-modal.js b/js/tests/unit/bootstrap-modal.js index 4bbb3313c..69e720f0f 100644 --- a/js/tests/unit/bootstrap-modal.js +++ b/js/tests/unit/bootstrap-modal.js @@ -86,4 +86,66 @@ $(function () { }) .modal("toggle") }) -})
\ No newline at end of file + + test("should add backdrop when desired", function () { + stop() + $.support.transition = false + var div = $("<div id='modal-test'></div>") + div + .modal({backdrop:true}) + .modal("show") + .bind("shown", function () { + equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom') + start() + div.remove() + $('.modal-backdrop').remove() + }) + }) + + test("should not add backdrop when not desired", function () { + stop() + $.support.transition = false + var div = $("<div id='modal-test'></div>") + div + .modal({backdrop:false}) + .modal("show") + .bind("shown", function () { + equal($('.modal-backdrop').length, 0, 'modal backdrop not inserted into dom') + start() + div.remove() + }) + }) + + test("should close backdrop when clicked", function () { + stop() + $.support.transition = false + var div = $("<div id='modal-test'></div>") + div + .modal({backdrop:true}) + .modal("show") + .bind("shown", function () { + equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom') + $('.modal-backdrop').click() + equal($('.modal-backdrop').length, 0, 'modal backdrop removed from dom') + start() + div.remove() + }) + }) + + test("should not close backdrop when click disabled", function () { + stop() + $.support.transition = false + var div = $("<div id='modal-test'></div>") + div + .modal({backdrop:true, backdropClickHides:false}) + .modal("show") + .bind("shown", function () { + equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom') + $('.modal-backdrop').click() + equal($('.modal-backdrop').length, 1, 'modal backdrop still in dom') + start() + div.remove() + $('.modal-backdrop').remove() + }) + }) +}) |