Make the content selector more explicit (contentFrom)
This commit is contained in:
parent
49f5ec7557
commit
eaf2c9e4d0
|
|
@ -18,7 +18,7 @@ You may add `data-control="popover"` to an anchor or button to activate a popove
|
||||||
|
|
||||||
### Template content
|
### Template content
|
||||||
|
|
||||||
Define the popover content as a template and reference it with `data-content="#myPopoverContent"`.
|
Define the popover content as a template and reference it with `data-content-from="#myPopoverContent"`.
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<script type="text/template" id="myPopoverContent">
|
<script type="text/template" id="myPopoverContent">
|
||||||
|
|
@ -47,7 +47,7 @@ Define the popover content as a template and reference it with `data-content="#m
|
||||||
class="btn btn-primary"
|
class="btn btn-primary"
|
||||||
data-control="popover"
|
data-control="popover"
|
||||||
data-width="200"
|
data-width="200"
|
||||||
data-content="#myPopoverContent">
|
data-content-from="#myPopoverContent">
|
||||||
Template popover
|
Template popover
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
|
|
@ -98,6 +98,8 @@ Closes the popover. There are 3 ways to close the popover: call it's `hide()` me
|
||||||
|
|
||||||
- `content`: content HTML string or callback
|
- `content`: content HTML string or callback
|
||||||
|
|
||||||
|
- `contentFrom`: selector to source the content HTML
|
||||||
|
|
||||||
- `width`: content width, optional. If not specified, the content width will be used.
|
- `width`: content width, optional. If not specified, the content width will be used.
|
||||||
|
|
||||||
- `modal`: make the popover modal
|
- `modal`: make the popover modal
|
||||||
|
|
|
||||||
|
|
@ -171,14 +171,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
Popover.prototype.getContent = function () {
|
Popover.prototype.getContent = function () {
|
||||||
var content = this.options.content
|
if (this.options.contentFrom) {
|
||||||
|
return $(this.options.contentFrom).html()
|
||||||
if (typeof content == 'function') {
|
|
||||||
return content.call(this.$el[0], this)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (content.charAt(0) === '#') {
|
if (typeof this.options.content == 'function') {
|
||||||
return $(content).html()
|
return this.options.content.call(this.$el[0], this)
|
||||||
}
|
}
|
||||||
|
|
||||||
return this.options.content
|
return this.options.content
|
||||||
|
|
@ -319,6 +317,7 @@
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
fallbackPlacement: 'bottom',
|
fallbackPlacement: 'bottom',
|
||||||
content: '<p>Popover content<p>',
|
content: '<p>Popover content<p>',
|
||||||
|
contentFrom: null,
|
||||||
width: false,
|
width: false,
|
||||||
modal: false,
|
modal: false,
|
||||||
highlightModalTarget: false,
|
highlightModalTarget: false,
|
||||||
|
|
|
||||||
|
|
@ -3440,9 +3440,8 @@ Popover.prototype.reposition=function(){var
|
||||||
placement=this.calcPlacement(),position=this.calcPosition(placement)
|
placement=this.calcPlacement(),position=this.calcPosition(placement)
|
||||||
this.$container.removeClass('placement-center placement-bottom placement-top placement-left placement-right')
|
this.$container.removeClass('placement-center placement-bottom placement-top placement-left placement-right')
|
||||||
this.$container.css({left:position.x,top:position.y}).addClass('placement-'+placement)}
|
this.$container.css({left:position.x,top:position.y}).addClass('placement-'+placement)}
|
||||||
Popover.prototype.getContent=function(){var content=this.options.content
|
Popover.prototype.getContent=function(){if(this.options.contentFrom){return $(this.options.contentFrom).html()}
|
||||||
if(typeof content=='function'){return content.call(this.$el[0],this)}
|
if(typeof this.options.content=='function'){return this.options.content.call(this.$el[0],this)}
|
||||||
if(content.charAt(0)==='#'){return $(content).html()}
|
|
||||||
return this.options.content}
|
return this.options.content}
|
||||||
Popover.prototype.calcDimensions=function(){var
|
Popover.prototype.calcDimensions=function(){var
|
||||||
documentWidth=$(document).width(),documentHeight=$(document).height(),targetOffset=this.$el.offset(),targetWidth=this.$el.outerWidth(),targetHeight=this.$el.outerHeight()
|
documentWidth=$(document).width(),documentHeight=$(document).height(),targetOffset=this.$el.offset(),targetWidth=this.$el.outerWidth(),targetHeight=this.$el.outerHeight()
|
||||||
|
|
@ -3490,7 +3489,7 @@ if(this.options.onCheckDocumentClickTarget&&this.options.onCheckDocumentClickTar
|
||||||
if($.contains(this.$container.get(0),e.target))
|
if($.contains(this.$container.get(0),e.target))
|
||||||
return
|
return
|
||||||
this.hide();}
|
this.hide();}
|
||||||
Popover.DEFAULTS={placement:'bottom',fallbackPlacement:'bottom',content:'<p>Popover content<p>',width:false,modal:false,highlightModalTarget:false,closeOnPageClick:true,closeOnEsc:true,container:false,containerClass:null,offset:15,useAnimation:false,onCheckDocumentClickTarget:null}
|
Popover.DEFAULTS={placement:'bottom',fallbackPlacement:'bottom',content:'<p>Popover content<p>',contentFrom:null,width:false,modal:false,highlightModalTarget:false,closeOnPageClick:true,closeOnEsc:true,container:false,containerClass:null,offset:15,useAnimation:false,onCheckDocumentClickTarget:null}
|
||||||
var old=$.fn.ocPopover
|
var old=$.fn.ocPopover
|
||||||
$.fn.ocPopover=function(option){var args=arguments;return this.each(function(){var $this=$(this)
|
$.fn.ocPopover=function(option){var args=arguments;return this.each(function(){var $this=$(this)
|
||||||
var data=$this.data('oc.popover')
|
var data=$this.data('oc.popover')
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue