popover

Good way to dynamically open / close a popover (or tooltip) using angular, based on expression?

You can also build your own extended triggers. This will apply to both Tooltip and Popover. First extend the Tooltip triggers as follows: // define additional triggers on Tooltip and Popover app.config([‘$tooltipProvider’, function($tooltipProvider){ $tooltipProvider.setTriggers({ ‘show’: ‘hide’ }); }]); Then define the trigger on the HTML tag like this: <div id=”RegisterHelp” popover-trigger=”show” popover-placement=”left” popover=”{{ ‘Login or … Read more

Twitter Bootstrap Popovers not working for Dynamically Generated Content

You need to call $(“[rel=popover]”).popover({placement:’left’}); AFTER the elements are in the DOM. UPDATE If you are using jQuery $(element_selector) // load results into HTML of element_selector .load(‘your/php/file’) // when done, initialize popovers .done(function(){ $(“[rel=popover]”).popover({placement:’left’}); }); OR a catch all for jQuery ajax requests $.ajaxComplete(function(){ $(“[rel=popover]”).popover({placement:’left’}); });

How to use Twitter Bootstrap popovers for jQuery validation notifications?

This is a hands-on example: $(‘form’).validate({ errorClass:’error’, validClass:’success’, errorElement:’span’, highlight: function (element, errorClass, validClass) { $(element).parents(“div[class=”clearfix”]”).addClass(errorClass).removeClass(validClass); }, unhighlight: function (element, errorClass, validClass) { $(element).parents(“.error”).removeClass(errorClass).addClass(validClass); } }); It doesn’t really use bootstrap popovers, but it looks really nice and is easy to achieve. UPDATE So, to have popover validation you can use this code: $(“form”).validate({ rules … Read more

How do I correctly pass a “cell item” to a .sheet from a SwiftUI LazyVGrid?

In such use-case it is more appropriate to use variant of sheet constructed with item, because sheet must be moved out of dynamic content (otherwise you create as many sheets as items in ForEach). Here is possible solution. Tested with Xcode 12 / iOS 14. // helper extension because .sheet(item:…) requires item to be Identifiable … Read more

Bootstrap popover content cannot changed dynamically

If you grab the popover instance like this: var popover = $(‘.reply’).data(‘bs.popover’); Then, to redraw the popover, use the .setContent() method: popover.setContent(); I found out browsing the source: https://github.com/twitter/bootstrap/blob/master/js/popover.js So, in your example, try: thisVal.attr(‘data-content’,data).data(‘bs.popover’).setContent(); Update The setContent() method also removes the placement class, so you should do: var popover = thisVal.attr(‘data-content’,data).data(‘bs.popover’); popover.setContent(); popover.$tip.addClass(popover.options.placement); Demo: … Read more

bootstrap popover not showing on top of all elements

I was able to solve the problem by setting data-container=”body” on the html element HTML example: <a href=”#” data-toggle=”tooltip” data-container=”body” title=”first tooltip”> hover over me </a> JavaScript example: $(‘your element’).tooltip({ container: ‘body’ }) Discovered from this link: https://github.com/twitter/bootstrap/issues/5889

How to insert close button in popover for Bootstrap

You need to make the markup right <button type=”button” id=”example” class=”btn btn-primary”>example</button> Then, one way is to attach the close-handler inside the element itself, the following works : $(document).ready(function() { $(“#example”).popover({ placement: ‘bottom’, html: ‘true’, title : ‘<span class=”text-info”><strong>title</strong></span>’+ ‘<button type=”button” id=”close” class=”close” onclick=”$(&quot;#example&quot;).popover(&quot;hide&quot;);”>&times;</button>’, content : ‘test’ }); });