Assalamu’alaikum wr. wb. disini saya asumsikan sudah bisa menyetting codeigniter
Membuat Antrian Dengan CodeIgniter dan Bootstrap dan jquery (Part 1)
Langkah awal adalah membuat file views,
buat sebuah folder baru dengan nama antrian didalam folder views (application/views/antrian).
nama file = “antrian_depan.php”
dengan code sebagai berikut
<html>
<head>
<title>Sistem Antrian</title>
<link rel="stylesheet" href="<?php echo base_url();?>bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="<?php echo base_url();?>bootstrap/css/jquery-ui.min.css">
</head>
<body>
<div class="container-fluid alert-danger">
<div class="row">
<div class="col-md-8">
<video src="<?php echo base_url();?>video/videoplayback.mp4" width="100%" muted loop controls autoplay class="img-thumbnail" style="width: 100%"></video>
</div>
<div class="col-md-4">
<div class="text-lg-center btn-success img-thumbnail" style="font-size: 50px;font-weight: bold;width: 100%;">
ANTRIAN<br/>
001
<div class="btn-danger">Loket 1</div>
</div>
<hr/>
<div class="text-lg-center btn-success img-thumbnail" style="font-size: 50px;font-weight: bold;width: 100%;">
ANTRIAN<br/>
003
<div class="btn-danger">Loket 2</div>
</div>
<hr/>
<div class="text-lg-center btn-success img-thumbnail" style="font-size: 50px;font-weight: bold;width: 100%;">
<?php echo date('l');?><br/><?php echo date('d F Y');?><br/>
<div class="btn-danger" id="jam_sekarang"><?php echo date('H:m:i');?></div>
</div>
</div>
</div>
</div>
<script src="<?php echo base_url();?>bootstrap/js/jquery.min.js"></script>
<script src="<?php echo base_url();?>bootstrap/js/jquery-ui.min.js"></script>
<script>
var myVar = setInterval(myTimer, 1000);
function myTimer() {
var d = new Date();
document.getElementById("jam_sekarang").innerHTML = d.toLocaleTimeString();
}
</script>
</body>
</html>
selanjutnya buat file controllers baru dengan nama Antrian.php didalam folder (application/controllers/Antrian.php
<?php if (!defined('BASEPATH')) exit('No direct script access allowed');
class Antrian extends CI_Controller
{
function __construct()
{
parent::__construct();
}
public function index()
{
$this->load->view('antrian/antrian_depan');
}
}
jika berhasil akan muncul view seperti dibawah ini
