Merge pull request #6378 from Yohn/patch-7

fixes tooltip insert problems

docs/javascript.html

@@ -849,6 +849,14 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
                 <p>Object structure is: <code>delay: { show: 500, hide: 100 }</code></p>
                </td>
              </tr>
+             <tr>
+               <td>container</td>
+               <td>string | false</td>
+               <td>false</td>
+               <td>
+                <p>Appends the tooltip to a specific element <code>container: 'body'</code></p>
+               </td>
+             </tr>
             </tbody>
           </table>
           <div class="alert alert-info">

docs/templates/pages/javascript.mustache

@@ -779,6 +779,14 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
                 <p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
                </td>
              </tr>
+             <tr>
+               <td>{{_i}}container{{/i}}</td>
+               <td>{{_i}}string | false{{/i}}</td>
+               <td>{{_i}}false{{/i}}</td>
+               <td>
+                <p>{{_i}}Appends the tooltip to a specific element <code>container: 'body'</code>{{/i}}</p>
+               </td>
+             </tr>
             </tbody>
           </table>
           <div class="alert alert-info">

js/bootstrap-tooltip.js

@@ -129,7 +129,8 @@
         $tip
           .detach()
           .css({ top: 0, left: 0, display: 'block' })
-          .insertAfter(this.$element)
+
+        this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
 
         pos = this.getPosition()
 
@@ -290,6 +291,7 @@
   , title: ''
   , delay: 0
   , html: false
+  , container: false
   }
 
 

js/tests/unit/bootstrap-tooltip.js

@@ -241,4 +241,14 @@ $(function () {
           .tooltip('toggle')
         ok($(".tooltip").is('.fade.in'), 'tooltip should be toggled in')
       })
+
+      test("should place tooltips inside the body", function () {
+        var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
+          .appendTo('#qunit-fixture')
+          .tooltip({container:'body'})
+          .tooltip('show')
+        ok($("body > .tooltip").length, 'inside the body')
+        ok(!$("#qunit-fixture > .tooltip").length, 'not found in parent')
+        tooltip.tooltip('hide')
+      })
 })