How to show/hide fields on link click? - php

Question

I am using laravel 5.3
I have a responding navigation menu, when I click on domains, it shows all the domains I already have in DB, and then when I click on one of these domains I get the corresponding projects.
Now, I am want that when I click on project it displays all the corresponding data in a table for example. But, this is what I am getting :
this is ProjectController :
public function index(Request $request)
{
$projects1=DB::table('projects')->where('domain_id', '=', 1)->get();
$projects2=DB::table('projects')->where('domain_id', '=', 2)->get();
$projects3=DB::table('projects')->where('domain_id', '=', 3)->get();
return view('projects.index',compact('projects', 'projects1', 'projects2', 'projects3'));
}
and this is index.blade.php :
<div class="nav-side-menu">
<div class="brand">Menu</div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li data-toggle="collapse" data-target="#products" class="collapsed active">
<i class="fa fa-gift fa-lg"></i> Domains <span class="arrow"></span>
</li>
<ul class="sub-menu collapse" id="products">
<li data-toggle="collapse" data-target="#domain1_projet" class="collapsed active">
<i class="fa fa-gift fa-lg"></i> Domain 1 <span class="arrow"></span>
</li>
<ul class="sub-menu collapse" id="domain1_projet">
#foreach ($projects1 as $key => $project)
<li>{{$project->title}}</li>
#endforeach
<table class="table table-bordered">
<tr>
<th>No</th>
<th>title</th>
<th>code</th>
<th>domain_id</th>
</tr>
#foreach ($projects1 as $key => $project1)
<tr>
<td>{{ ++$i }}</td>
<td>{{ $project1->title }}</td>
<td>{{ $project1->code }}</td>
<td>{{ $project1->domain_id}}</td>
</tr>
#endforeach
</table>
</ul>
<li data-toggle="collapse" data-target="#domain2_projet" class="collapsed active">
<i class="fa fa-gift fa-lg"></i> Domain 2 <span class="arrow"></span>
</li>
<ul class="sub-menu collapse" id="domaine2_projet">
#foreach ($projects2 as $key => $project)
<li>{{$project->title}}</li>
#endforeach
</ul>
</ul>
</ul>
</div>
</div>
the #if clause I added before table was just to test, but I need to change that. I want to be able to display data of each project not in a manual way. I also want to know how to show and hide the information of each project when clicking on the links.
As you can see in index.blade.php, It's because I already know the names of project I did if (($project->intitule)=="Title") and elseif(($project->intitule)=="Project2") But, in fact I have many projects in database. How can I be able to display all the projects and then when I click on one of them, how can get a table containing information of that specific project

Answer 1

CONTROLLER
public function index(Request $request)
{
$projects=DB::table('projects')->get();
return view('projects.index',compact('projects'));
}
VIEW
<div class="nav-side-menu">
<div class="brand">Menu</div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li data-toggle="collapse" data-target="#products" class="collapsed active">
<i class="fa fa-gift fa-lg"></i> Domains <span class="arrow"></span>
</li>
<ul class="sub-menu collapse" id="products">
#for ($i = 0; $i < count($projects); $i++)
<li data-toggle="collapse" data-target="#domain1_projet{{$i}}" class="collapsed active">
<i class="fa fa-gift fa-lg"></i> Domain {{$projects[$i]->domain_id}} <span class="arrow"></span>
</li>
<ul class="sub-menu collapse" id="domain1_projet{{$i}}">
<li>{{$projects[$i]->title}}</li>
<table class="table table-bordered">
<tr>
<th>No</th>
<th>title</th>
<th>code</th>
<th>domain_id</th>
</tr>
<tr>
<td>{{ $i }}</td>
<td>{{ $projects[$i]->title }}</td>
<td>{{ $projects[$i]->code }}</td>
<td>{{ $projects[$i]->domain_id}}</td>
</tr>
</table>
</ul>
#endfor
</ul>
</ul>
</div>
</div>
Try it! and let me know if return errors!