rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-03-01 01:54:24 +01:00
Code Issues Actions Packages Releases Activity

Adding flag to prevent backdrop click hiding modal

Browse Source
This commit is contained in:
Nick Veys 2011-09-17 14:47:38 -05:00
parent 732ff9ed1c
commit 2cb233319d
3 changed files with 74 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/javascript.html
View File

@ -105,6 +105,12 @@
<td>false</td>
<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>

7
js/bootstrap-modal.js vendored
View File

@ -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
}

64
js/tests/unit/bootstrap-modal.js vendored
View File

@ -86,4 +86,66 @@ $(function () {
})
.modal("toggle")
})
})
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()
})
})
})