Permalink
Browse files

Merge pull request #554 from rvagg/poveropt

optionable selectors for title & content elements
  • Loading branch information...
2 parents b15e24e + 1b43c87 commit b37a336417b0ef447eed78a66762be1ac0f0fba4 @fat fat committed Nov 7, 2011
Showing with 47 additions and 10 deletions.
  1. +18 −6 docs/javascript.html
  2. +5 −3 js/bootstrap-popover.js
  3. +24 −1 js/tests/unit/bootstrap-popover.js
View
24 docs/javascript.html
@@ -487,8 +487,8 @@
<thead>
<tr>
<th style="width: 100px;">Name</th>
- <th style="width: 100px;">type</th>
- <th style="width: 50px;">default</th>
+ <th style="width: 95px;">type</th>
+ <th style="width: 95px;">default</th>
<th>description</th>
</tr>
</thead>
@@ -557,7 +557,7 @@
<td>template</td>
<td>string</td>
<td>[default markup]</td>
- <td>The html template used for rendering a twipsy.</td>
+ <td>the html template used for rendering a twipsy</td>
</tr>
</tbody>
</table>
@@ -613,8 +613,8 @@
<thead>
<tr>
<th style="width: 100px;">Name</th>
- <th style="width: 100px;">type</th>
- <th style="width: 50px;">default</th>
+ <th style="width: 95px;">type</th>
+ <th style="width: 95px;">default</th>
<th>description</th>
</tr>
</thead>
@@ -689,7 +689,19 @@
<td>template</td>
<td>string</td>
<td>[default markup]</td>
- <td>The html template used for rendering a popover.</td>
+ <td>the html template used for rendering a popover</td>
+ </tr>
+ <tr>
+ <td>titleSelector</td>
+ <td>string</td>
+ <td>.title</td>
+ <td>selector used to find the title element within the popover</td>
+ </tr>
+ <tr>
+ <td>contentSelector</td>
+ <td>string</td>
+ <td>.content p</td>
+ <td>selector used to find the content element within the popover</td>
</tr>
</tbody>
</table>
View
8 js/bootstrap-popover.js
@@ -36,8 +36,8 @@
setContent: function () {
var $tip = this.tip()
- $tip.find('.title')[this.options.html ? 'html' : 'text'](this.getTitle())
- $tip.find('.content p')[this.options.html ? 'html' : 'text'](this.getContent())
+ $tip.find(this.options.titleSelector)[this.options.html ? 'html' : 'text'](this.getTitle())
+ $tip.find(this.options.contentSelector)[this.options.html ? 'html' : 'text'](this.getContent())
$tip[0].className = 'popover'
}
@@ -83,8 +83,10 @@
placement: 'right'
, content: 'data-content'
, template: '<div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div>'
+ , titleSelector: '.title'
+ , contentSelector: '.content p'
})
$.fn.twipsy.rejectAttrOptions.push( 'content' )
-}( window.jQuery || window.ender );
+}( window.jQuery || window.ender );
View
25 js/tests/unit/bootstrap-popover.js
@@ -73,4 +73,27 @@ $(function () {
$('#qunit-runoff').empty()
})
-})
+ test("should allow arbitrary template html with title and content selector options", function() {
+ $.support.transition = false
+ var expectedTitle = 'Gotta make you understand'
+ , popover = $('<a href="#">@rvagg</a>')
+ .attr('title', expectedTitle)
+ .attr('data-content', '<p><b>Never gonna give you up</b>,</p><p>Never gonna let you down</p>')
+ .appendTo('#qunit-runoff')
+ .popover({
+ html: true
+ , titleSelector: 'h1'
+ , contentSelector: '.rick > .roll'
+ , template: '<div class="rick"><h1></h1><div class="roll"></div></div>'
+ })
+ .popover('show')
+
+ ok($('.popover > div > h1').length, 'h1 tag was inserted')
+ ok($('.popover > div > h1').text() === expectedTitle)
+ ok($('.popover > .rick > .roll > p').length === 2, 'p > b tags were inserted')
+ popover.popover('hide')
+ ok(!$('.popover').length, 'popover was removed')
+ $('#qunit-runoff').empty()
+ })
+
+})

0 comments on commit b37a336

Please sign in to comment.