I want to create a dynamic timeline based on from a database. Which is where the milestone will appear based on data in the database. The problem is that when calling data from the milestone database in the timeline, it cannot be clicked because it has been selected by hardcode. But when I change it, the timeline event show but cannot be selected. Click it for the image of my timeline As u can see the event show up but can not to be selected. Please help me to make dynamic timeline event from my database and can be selected to show my other data as array on the content of my timeline like this
controler
public function index()
{
$data['title'] = 'Belanda';
$data['tanggal'] =$this->Info_pameran_belanda_model->timeline();
$data['pameran_belanda'] =$this->Info_pameran_belanda_model->data();
$this->load->view('auth/header');
$this->load->view('auth/sidebar',$data);
$this->load->view('belanda/timeline',$data);
$this->load->view('auth/footer');
}`
my model
public function timeline()
{
$hasil= $this->db->query("SELECT * FROM persiapanawals");
return $hasil;
}
public function data()
{
$hasil= $this->db->query("SELECT * FROM pameran_belanda");
return $hasil;
}
}
My views
<div class="main-panel"><div class="content-wrapper"><div class="container"> <section class="cd-h-timeline js-cd-h-timeline margin-bottom-md"><div class="cd-h-timeline__container container"><div class="cd-h-timeline__dates"><div class="cd-h-timeline__line"><ol><?php
foreach($tanggal->result_array() as $i):
$id=$i['id'];
$tanggal=$i['tanggal'];
$kegiatan=$i['kegiatan'];
?> <li><a href="#" data-date="<?=$i['tanggal']?>"class="cd-h-timeline__date cd-h-timeline__date"><?=$i['tanggal']?></a></li></ol><?php endforeach;?> <span class="cd-h-timeline__filling-line" aria-hidden="true"></span></div> <!-- .cd-h-timeline__line --></div> <!-- .cd-h-timeline__dates --><ul><li><a href="#0" class="text-replace cd-h-timeline__navigation cd-h-timeline__navigation--prev cd-h-timeline__navigation--inactive">Prev</a></li><li><a href="#0" class="text-replace cd-h-timeline__navigation cd-h-timeline__navigation--next">Next</a></li></ul></div> <!-- .cd-h-timeline__container --><div class="cd-h-timeline__events"><ol><?php
foreach($pameran_belanda->result_array() as $i):
$id=$i['id'];
$keterangan=$i['keterangan'];
$kegiatan=$i['nama_kegiatan'];
?> <li class="cd-h-timeline__event cd-h-timeline__event text-component"><div class="cd-h-timeline__event-content container"><h2 class="cd-h-timeline__event-title"><?=$i['nama_kegiatan']?></h2><p class="cd-h-timeline__event-description color-contrast-medium"> <?=$i['keterangan']?></p></div></li><?php endforeach;?> I want to appear like this without the same data repeated. Click it for the image
the data is repeated because I added it this code again in my views
<li><a href="#" data-date="<?=$i['tanggal']?>"class="cd-h-timeline__date cd-h-timeline__date"><?=$i['tanggal']?></a></li>
sorry for my long post and my explenation.