Open section of bootstrap accordion with anchored link

0

The problem I have is that I want to go from my home page by clicking on a link to address my frequent questions page and open a section of my accordion. Try the normal way by adding the link # collapse1 but it does not work that way.

These are the links to my help page / frequently asked questions

<li><a href="<%=ResolveUrl("~/paginas/preguntasfrecuentes.aspx")%>">Métodos de pago</a></li>
<li><a href="<%=ResolveUrl("~/ayuda")%>">Envios</a></li>

And that's how I got my accordion

<div class="panel-group" id="QA-accordion">
   <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#QA-accordion" href="#collapse1">¿Cuál es el procedimiento para darme de alta?</a>
            </h4>
        </div>
        <div id="collapse1" class="panel-collapse collapse">
            <div class ="panel-body">
                <p>
                   Ingresar a la página, en la parte inferior hay 3 columnas, bien en la columna de usuarios, en la pestaña de iniciar sesión de click, proporcionar su dirección de e-mail y crear una contraseña y llenar los campos requeridos...
                </p>
            </div>
        </div>

    
asked by ItzyV 24.08.2017 в 18:49
source

2 answers

0

I found out how to do it already (it sounds silly that I answered myself, but I know that someday someone will take care of this)

Just add:

<script>
$(document).ready(function () {
    var anchor = window.location.hash;
    $(anchor).collapse('toggle');
});
</script>

And in the links href="<%=ResolveUrl("linkdelapagina#id-de-la-seccion-que-deseaba-abrir")%>"

    
answered by 24.08.2017 / 21:54
source
0

If it is always the same panel that you want to open, why do not you leave it open and put the class in ?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="panel-group" id="QA-accordion">
   <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#QA-accordion" href="#collapse1">¿Cuál es el procedimiento para darme de alta?</a>
            </h4>
        </div>
        <div id="collapse1" class="panel-collapse collapse in">
            <div class ="panel-body">
                <p>
                   Ingresar a la página, en la parte inferior hay 3 columnas, bien en la columna de usuarios, en la pestaña de iniciar sesión de click, proporcionar su dirección de e-mail y crear una contraseña y llenar los campos requeridos...
                </p>
            </div>
        </div>
    </div>
</div>

Greetings

    
answered by 24.08.2017 в 21:33