Skip to content

Instantly share code, notes, and snippets.

@katon26
Created October 17, 2019 12:31
Show Gist options
  • Save katon26/8a8919f60e0fcb387b668eff9dc0b3d7 to your computer and use it in GitHub Desktop.
Save katon26/8a8919f60e0fcb387b668eff9dc0b3d7 to your computer and use it in GitHub Desktop.
index.blade.php Laravel Tutorial Create & Read
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class="container col-11">
@if(session('success'))
<div class="alert alert-success" role="alert">
{{session('success')}}
</div>
@endif
<div class="row">
<div class="col-6">
<h1>Employees Data</h1>
</div>
<div class="col-6">
<button type="button" class="btn btn-primary btn-sm float-right" data-toggle="modal" data-target="#exampleModal">
Add employee data
</button>
</div>
<table class="table table-hover">
<tr>
<th>No</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Phone Number</th>
<th>Hire Date</th>
<th>Job ID</th>
<th>Salary</th>
<th>Commission Pct</th>
<th>Manager Id</th>
<th>Department Id</th>
<th>AKSI</th>
</tr>
@foreach($employees as $e)
<tr>
<td>{{$loop->iteration}}</td>
<td>{{$e->first_name}}</td>
<td>{{$e->last_name}}</td>
<td>{{$e->email}}</td>
<td>{{$e->phone_number}}</td>
<td>{{$e->hire_date}}</td>
<td>{{$e->job_id}}</td>
<td>{{$e->salary}}</td>
<td>{{$e->commission_pct}}</td>
<td>{{$e->manager_id}}</td>
<td>{{$e->department_id}}</td>
<td><a href="/employees/{{$e->employee_id}}/edit" class="btn btn-warning btn-sm">Edit</a></td>
</tr>
@endforeach
</table>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Add New Employee</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form action="/employees" method="POST">
@csrf
<div class="form-group">
<label for="employee_id">Employee ID</label>
<input name="employee_id" type="text" class="form-control" id="employee_id" value="{{$employees->max('employee_id')+1}}" readonly="readonly">
<label for="first_name">First Name</label>
<input name="first_name" type="text" class="form-control" id="first_name" placeholder="First Name">
<label for="last_name">Last Name</label>
<input name="last_name" type="text" class="form-control" id="last_name" placeholder="Last Name">
<label for="exampleInputEmail1">Email</label>
<input name="email" type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter Email">
<label for="phone_number">Phone Number</label>
<input name="phone_number" type="text" class="form-control" id="phone_number" placeholder="Phone Number">
<label for="hire_date">Hire Date</label>
<input name="hire_date" type="date" class="form-control" id="hire_date" placeholder="Hire Date">
<label for="job_id">Job Id</label>
<select name="job_id" id="job_id" class="custom-select">
@foreach($jobs as $J)
<option>{{ $J->job_id}}</option>
@endforeach
</select>
<label for="exampleInputEmail1">Salary</label>
<input name="salary" type="decimal(8,2)" class="form-control" id="exampleInputEmail1" placeholder="Salary">
<label for="manager_id">Manager Id</label>
<select name="manager_id" id="manager_id" class="custom-select">
@foreach($employees as $e)
<option>{{$e -> employee_id}}</option>
@endforeach
</select>
<label for="department_id">Department ID</label>
<select name="department_id" id="department_id" class="custom-select">
@foreach($departments as $d)
<option>{{$d -> department_id}}</option>
@endforeach
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment