CODEWITHSUNDEEP
jqueryhtmltwitter-bootstrap
aVC
aVC

Reputation: 2344

Cannot click on html elements inside bootstrap popover title html

I have a popover with html:true; I want to click on an element in the title, to close the popover, but it does not seem to do the job.

test fiddle http://jsfiddle.net/9P64a/1362/

Upvotes: 1

Views: 87

Answers (2)

Lloyd Banks
Lloyd Banks

Reputation: 36659

Bootstrap dynamically creates and deletes the popover element ever time the element appears / disappears (as opposed to showing and hiding an element that is only created once). To account for this, you need to list the parent container when you use jQuery's .on() method.

Change

$('#btncancel').on("click",function()

to

$('body').on('click', '#btncancel', function()

The above looks for the element #btncancel within the HTML body element and will do so even if #btncancel is created / deleted / recreated on the DOM.

Example

Upvotes: 1

Miomir Dancevic
Miomir Dancevic

Reputation: 6852

What version of jquery you are using??

In your fiddle

$('#popoverData').popover({ html: true });
$('#btncancel').live("click",function(){
    $('#popoverData').popover('hide');
});

I used live() for generated pages and frames. But in jQuery 1.9 this function is deprecated and does not work.

Already answered here Turning live() into on() in jQuery

Update

$('#popoverData').popover({ html: true });
$(document).on("click", '#btncancel', function () {
   $('#popoverData').popover('hide');
} );

Upvotes: 0

Related Questions