When you open Popover [bootstrap] the screen loses focus and goes to the top

0

I have a query screen where I feed an html table with the database records. In one of the columns, of each line, there are some options like edit, delete, add photos and another option that opens the Popover.

This Popover is Bootstrap 3 and it happens that every time I click on these popover buttons the screen loses focus from where it is and goes to the top of the page, I do not want this to happen, how to proceed?

Follow the code:

<td class="col-small center">
<div class="action-buttons">
    <div id="popover_content_AlugadoVendido" style="display: none">
        <form class="marcarComoVendido">
            <div>
                <p>
                    <input <%=checkNone%> type="radio" name="marcarComoVendido" id="none" onclick="alugadoVendido('src/rotinas/rotinas.asp?acao=Vendido&id=<%=rsAnuncios("id")%>&tipo=none&idInput=none&outroInput=marcarComoAlugado<%=rsAnuncios("id")%>', 'none');" /> NENHUM
                </p>
                <p>
                    <input <%=checkVendido%> type="radio" name="marcarComoVendido" id="marcarComoVendido<%=rsAnuncios("id")%>" onclick="alugadoVendido('src/rotinas/rotinas.asp?acao=Vendido&id=<%=rsAnuncios("id")%>&tipo=vendido&idInput=marcarComoVendido<%=rsAnuncios("id")%>', 'marcarComoVendido<%=rsAnuncios("id")%>');" /> VENDIDO
                </p>
                <p>
                    <input <%=checkAlugado%> type="radio" name="marcarComoVendido" id="marcarComoAlugado<%=rsAnuncios("id")%>" onclick="alugadoVendido('src/rotinas/rotinas.asp?acao=Vendido&id=<%=rsAnuncios("id")%>&tipo=alugado&idInput=marcarComoAlugado<%=rsAnuncios("id")%>', 'marcarComoAlugado<%=rsAnuncios("id")%>');" /> ALUGADO
                </p>                                
            </div>  
        </form>
    </div>
</div>
<a href="#" class="popoverAlugadoVendido" data-toggle="popover" data-rel="tooltip"><i class="fa fa-cog bigger-130"></i></a>
</td>

And here's the javascript:

<script>
$(document).ready(function() {
    $('.popoverAlugadoVendido').popover({
        title: '<b>Alugado ou Vendido</b> <button class="close" data-toggle="clickover" data-dismiss="popover" aria-hidden="true" onclick="$(\'.popoverAlugadoVendido\').popover(\'hide\');">&times;</button>',
        placement : 'left',
        trigger: 'click',
        container: 'body',
        content: function() {
            return $('#popover_content_AlugadoVendido').html();
        },
        html: true
    });
});
</script>
    
asked by anonymous 13.04.2015 / 18:34

1 answer

2

I resolved by removing the href tag from the link.

<a class="popoverAlugadoVendido" data-toggle="popover" data-rel="tooltip"><i class="fa fa-cog bigger-130"></i></a>
    
14.04.2015 / 19:02