jquery - Buttons inside Bootstrap Popover are not triggered -



jquery - Buttons inside Bootstrap Popover are not triggered -

i'm tring trigger buttons within popover loaded ajax couldn't find solution. here tried:

popover loaded ajax:

$('.item-instances').popover({ trigger: 'click', placement: 'bottom', title: 'title', html: true, content: function(){ var toreturn = []; $.each(iteminstances($(this)), function(k, v){ toreturn[k] = '<a href="#" class="instance-image-'+ v.image_id +'">abc</a>'; }); homecoming toreturn; } });

and tried trigger link popover:

$( document ).ajaxcomplete(function() { $('a[class^="instance-image-"]').each(function(index, el) { $(this).on('click', function(event) { event.preventdefault(); console.log('test'); }); }); });

any suggestion whould great. give thanks you.

you may binding multiple times, can utilize unbind() , this:

class="snippet-code-js lang-js prettyprint-override">$('.item-instances').popover({ trigger: 'click', placement: 'bottom', title: 'title', html: true, content: function(){ var toreturn = []; $('.item-instances').each(function(k, v){ toreturn[k] = '<a href="#" class="instance-image-'+ k +'">abc</a>'; }); homecoming toreturn; } }); function rebindlisteners() { $('a[class^="instance-image-"]').each(function(index, el) { $(this).unbind().on('click', function(event) { event.preventdefault(); console.log('test'); alert('works'); }); }); } $( document ).ajaxcomplete(rebindlisteners); // illustration $(document).on('shown.bs.popover', rebindlisteners); class="snippet-code-html lang-html prettyprint-override"><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <button type="button" class="btn btn-default item-instances" data-container="body" data-toggle="popover"> popover on bottom </button>

note modified content since not have functions / data.

jquery ajax twitter-bootstrap

Comments

Popular posts from this blog

java - How to set log4j.defaultInitOverride property to false in jboss server 6 -

c - GStreamer 1.0 1.4.5 RTSP Example Server sends 503 Service unavailable -

Using ajax with sonata admin list view pagination -