Tengo un nav tab pills con los días de la semana. Mi intención es que según el día se seleccione el tab correspondiente.
Para ello he utilizado la función date("w");
para extraer en formato numérico del 0 al 6 el día de la semana, siendo 0 el domingo. He guardado el valor en una variable $dia
.
Mi pregunta es ¿cómo puedo hacer ahora que se active cada pestaña según el número del día? He probado hacer un if($dia == "1"){ echo "active"; }else{ }
pero al colocarlo solo en el tab no me funciona. Sí que selecciona el tab correspondiente pero no muestra su contenido.
¿Hay alguna otra forma de hacerlo? Este es mi código y tengo dudas de dónde colocarlo. No pongo todos los días de la semana para no hacerlo largo.
<?php $dia = date("w"); ?>
<div class="bs-example bs-example-tabs" role="tabpanel" data-bs-example-id="togglable-tabs">
<ul id="myTab" class="nav nav-pills nav-tabs-responsive justify-content-center" role="tablist">
<li role="presentation" class="active">
<a id="lunes-tab" class="active nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#lunes" aria-controls="home" aria-expanded="true">
<span class="text">Lunes</span>
</a>
</li>
<li role="presentation" class="next">
<a role="tab" class="nav-link" id="martes-tab" data-bs-toggle="tab" data-bs-target="#martes" aria-controls="profile" aria-expanded="false">
<span class="text">Martes</span>
</a>
</li>
<li role="presentation">
<a role="tab" class="nav-link" id="miercoles-tab" data-bs-toggle="tab" data-bs-target="#miercoles" aria-controls="profile1" aria-expanded="false">
<span class="text">Miercoles</span>
</a>
</li>
</ul>
<div id="myTabContent" class="tab-content">
<div role="tabpanel" class="tab-pane fade show active" id="lunes" aria-labelledby="home-tab">
<p>Lunes p/>
</div>
<div role="tabpanel" class="tab-pane fade" id="martes" aria-labelledby="profile-tab">
<p>
Martes
</p>
</div>
<div role="tabpanel" class="tab-pane fade" id="miercoles" aria-labelledby="profile1-tab">
<p>
Miercoles
</p>
</div>
</div>