1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00

adds remote source to modal. Remote source can be specified in href or by providing a remote option #936

This commit is contained in:
Jacob Thornton 2012-06-03 21:26:54 -07:00
parent 041b8bdfd3
commit 82ea5847a7
6 changed files with 30 additions and 10 deletions

View file

@ -30,6 +30,7 @@
this.options = options this.options = options
this.$element = $(content) this.$element = $(content)
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this)) .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
this.options.remote && this.$element.find('.modal-body').load(this.options.remote)
} }
Modal.prototype = { Modal.prototype = {
@ -215,9 +216,10 @@
$(function () { $(function () {
$('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) { $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
var $this = $(this), href var $this = $(this)
, $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7 , href = $this.attr('href')
, option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data()) , $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
, option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
e.preventDefault() e.preventDefault()
$target.modal(option) $target.modal(option)

View file

@ -755,6 +755,7 @@
this.options = options this.options = options
this.$element = $(content) this.$element = $(content)
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this)) .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
this.options.remote && this.$element.find('.modal-body').load(this.options.remote)
} }
Modal.prototype = { Modal.prototype = {
@ -940,9 +941,10 @@
$(function () { $(function () {
$('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) { $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
var $this = $(this), href var $this = $(this)
, $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7 , href = $this.attr('href')
, option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data()) , $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
, option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
e.preventDefault() e.preventDefault()
$target.modal(option) $target.modal(option)

File diff suppressed because one or more lines are too long

View file

@ -269,6 +269,13 @@
<td>true</td> <td>true</td>
<td>Shows the modal when initialized.</td> <td>Shows the modal when initialized.</td>
</tr> </tr>
<tr>
<td>remote</td>
<td>path</td>
<td>false</td>
<td><p>If a remote url is provided, content will be loaded via jQuery's <code>load</code> method and injected into the <code>.modal-body</code>. If you're using the data api, you may alternatively use the <code>href</code> tag to specify the remote source. An example of this is shown below:</p>
<pre class="prettyprint linenums"><code>&lt;a data-toggle="modal" href="remote.html" data-target="#modal"&gt;click me&lt;/a&gt;</code></pre></td>
</tr>
</tbody> </tbody>
</table> </table>
<h3>Markup</h3> <h3>Markup</h3>

View file

@ -191,6 +191,13 @@
<td>{{_i}}true{{/i}}</td> <td>{{_i}}true{{/i}}</td>
<td>{{_i}}Shows the modal when initialized.{{/i}}</td> <td>{{_i}}Shows the modal when initialized.{{/i}}</td>
</tr> </tr>
<tr>
<td>{{_i}}remote{{/i}}</td>
<td>{{_i}}path{{/i}}</td>
<td>{{_i}}false{{/i}}</td>
<td><p>{{_i}}If a remote url is provided, content will be loaded via jQuery's <code>load</code> method and injected into the <code>.modal-body</code>. If you're using the data api, you may alternatively use the <code>href</code> tag to specify the remote source. An example of this is shown below:{{/i}}</p>
<pre class="prettyprint linenums"><code>&lt;a data-toggle="modal" href="remote.html" data-target="#modal"&gt;click me&lt;/a&gt;</code></pre></td>
</tr>
</tbody> </tbody>
</table> </table>
<h3>{{_i}}Markup{{/i}}</h3> <h3>{{_i}}Markup{{/i}}</h3>

View file

@ -30,6 +30,7 @@
this.options = options this.options = options
this.$element = $(content) this.$element = $(content)
.delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this)) .delegate('[data-dismiss="modal"]', 'click.dismiss.modal', $.proxy(this.hide, this))
this.options.remote && this.$element.find('.modal-body').load(this.options.remote)
} }
Modal.prototype = { Modal.prototype = {
@ -215,9 +216,10 @@
$(function () { $(function () {
$('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) { $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
var $this = $(this), href var $this = $(this)
, $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7 , href = $this.attr('href')
, option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data()) , $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
, option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
e.preventDefault() e.preventDefault()
$target.modal(option) $target.modal(option)