2

tengo un grupo de eventos que obtengo de una base de datos pero algunos eventos se crean en el mismo dia.. al mostrarlos en un timeline de bootstrap encima los eventos al tener la misma fecha.. como podria separarlos? o que el atributo data-date sea un datetime en vez de un date que usa el script del bootstrap (horizontal-timeline.js)

<!-- .timeline -->
<div class="events-content">
  <ol>
    <?php
    $selected = 'class="selected"';  
    $sql2 = $conexion->query("SELECT * FROM loghistorial WHERE 
            folioth='$foliot'  ORDER BY id_logh ASC");
    while ($row2 = $sql2->fetch_assoc()){
           $logh = $row2["logh"];//texto del evento 
           $f_logh = $row2["fecha_logh"];//fecha evento 16/01/2019
           $h_logh = $row2["hora_logh"];//hora 11:33:38 
    ?>
    <li <?php echo $selected; ?> data-date="<?php echo $f_logh; ?>">
      <!-- cuerpo del evento -->
       <?php echo $logh; ?>
    </li>
  </ol>
  <?php
  $selected = '';  
  }//fin del While
  ?>
</div>
<!-- .fin de timeline -->

1
  • podrias crear el li de manera dinamica mediante un ciclo for depende el lenguaje como php..o javascript.... Commented el 22 feb. 2019 a las 17:48

2 respuestas 2

0

¿Cómo los traes de la base de datos? - Si mostraras la manera en que los metes en la base de datos podría quizá ayudarte mejor.


En cualquier caso, deberías verificar si el date ya esta en las listas, por lo tanto seria chequear el atributo data-date cada vez que quisiera insertar algo.

Haces un barrido a <ol> a todos sus hijos, y si tienen el atributo "data-date", chequear el valor, y - si ya existe - no meterlo o meterlo después de ese o antes.

quizá no te solucione nada, pero podría ayudar.

0

encontre la solucion, muchas gracias a los que me apoyaron.. no encontraba documentacion del script del timeline.. asi que despues de buscar y buscar.. encontre que en el data-date se le puede dar 3 formatos..

  • DD/MM/YYYY -> solo día;
  • DD/MM/YYYYTHH:MM -> para considerar el tiempo (22/02/2019T12:40)importante la letra "T"
  • HH:MM -> solo tiempo (para eventos que ocurren dentro del mismo día).

en otras palabras en la parte: data-date="<?php echo $fecha_logh."T".$hora_logh; ?>"> (sin los segundos)

y de esta forma ya se puede mostrar un timeline horizontal con eventos con la misma fecha.. espero les sirva a quien lo use en su momento..

reconocimiento a quien se lo merece.. saque la info de la siguiente pagina: https://codyhouse.co/gem/horizontal-timeline

salu2

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.