Popover en Modal of Bootstrap 3.0.3

Question

I have a form in a Modal and when I do click in "Send" this must show a popover with the word "Thanks you", but When I click the first time, the popover is not displayed, but from the second time onwards and shows good.

My code is here

$(document).on('submit', 'form#contact',function(event) {
    $('#submit').popover({ trigger:'click', content: 'Gracias por tu opinion', placement: 'left' });
    event.preventDefault();
});

jsfiddle : http://jsfiddle.net/gonzalesc/T348e/

Something I'm doing wrong, because the popover should show from the first time that I do click Thanks

Answer 1

What happends is, that in your first click, or submit, you insert the popover to the submit button :

$('#submit').popover({ trigger:'click', content: 'Gracias por tu opinion', placement: 'left' });

with trigger : 'click'. This means, that the popover only will be shown next time the user clicks on the submit button. To show the popover immediately, do this :

$('#submit').popover({ trigger: "manual", content: 'Gracias por tu opinion', placement: 'left' }).popover('show');

change trigger to manual, and force the popover to be shown by .popover('show').

forked fiddle -> http://jsfiddle.net/LWeYF/