change placement bootstrap tooltip

Question

I want to make tooltip from boostrap, when input select has selected so tooltip show in element html. I have made that code in javascipt/jquery. this is code:

    $('#pembayaran').on('change', function(){
        if($(this).val()=='GRATIS' && $('#keterangan').val()==''){
            $('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show');
        }
    });

I want to make tooltip position on right.

I try code

    $('#pembayaran').on('change', function(){
        if($(this).val()=='GRATIS' && $('#keterangan').val()==''){
            $('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show', {
               placement: 'right'
            });
        }
    });

but this code not working. Can you help me. please

Answer 1

The bootstrap plugin methods take a single argument, not two. This method call:

$('#keterangan').attr('title', 'Keterangan wajib disi!').tooltip('show', {
    placement: 'right'
});

is incorrect. Instead, you should keep the on change function the way you had it, and call:

$('#keterangan').tooltip({ placement: 'right' });

earlier to set up the tooltip options (such as when the document is ready).

The other, possibly simpler, alternative would be to add data-position="right" to the element that the pop-up is being shown on.