Menampilkan Data berdasarkan Bulan Menggunakan PHP

//lh3.googleusercontent.com/-K5UKWzgJhmU/AAAAAAAAAAI/AAAAAAAACdI/CN3nwiBZsGE/s512-c/photo.jpg
October 06, 2018

Selamat malam sobat blogger kali ini kami akan share bagaimana menampilkan data yang ada di database berdasarkan bulan yang dipilih. Aplikasi sederhana seperti ini sangat cocok bagi sebuah sistem yang mempunyai data yang sangat banyak.



Langsung saja mari kutai mulai dari tahap demi tahap, ada beberapa yang mesti kalian buat dan setiap file memilik script dan fungsi yang berbeda. Pada setiap file kami akan jelaskan secara detail.

config.php
index.php
filter.php
save.php

Tetapi sebelum itu buat databse terlebih dahulu, buat database dengan nama search.php kemudian masukkan struktur database dibawah ini.

 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";


CREATE TABLE `product` (
  `product_id` int(11) NOT NULL,
  `product_name` varchar(50) NOT NULL,
  `supplier` varchar(50) NOT NULL,
  `date` date NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;


INSERT INTO `product` (`product_id`, `product_name`, `supplier`, `date`) VALUES
(1, 'Iphone X (2018)', 'Iphone', '2018-09-15'),
(2, 'Iphone 8 Plus (2018)', 'Iphone', '2018-08-15'),
(3, 'Iphone 8 (2018)', 'Iphone', '2018-07-15'),
(4, 'Iphone 7 Plus (2018)', 'Iphone', '2018-06-15'),
(5, 'Iphone 7 (2018)', 'Iphone', '2018-05-15'),
(6, 'Iphone 6 Plus (2018)', 'Iphone', '2018-04-15'),
(7, 'Iphone 6 (2018)', 'Iphone', '2018-03-15'),
(8, 'Iphone 5 Plus (2018)', 'Iphone', '2018-02-15'),
(9, 'Iphone 5 (2018)', 'Iphone', '2018-01-15'),
(10, 'Iphone 4 (2018)', 'Iphone', '2018-10-05');


ALTER TABLE `product`
  ADD PRIMARY KEY (`product_id`);

ALTER TABLE `product`
  MODIFY `product_id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=11;
COMMIT; 

config.php
File ini berfungsi sebagai koneksi kedatabase.

 <?php
$conn = mysqli_connect('localhost', 'root', '', 'search');

if(!$conn){
 die("Error: Failed to connect to database!");
}
?> 

index.php
File ini berisi script untuk menampilkan data database, berisi script filter dan terdapat form data-model sebagai input data.

 <!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"/>
 <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
</head>
<body>
 <nav class="navbar navbar-default">
  <div class="ocntainer-fluid">
   <a class="navbar-brand" href="https://www.tutorialswb.com/">TutorialsWB.com</a>
  </div>
 </nav>
 <div class="col-md-3"></div>
 <div class="col-md-6 well">
  <button type="button" class="btn btn-success" data-toggle="modal" data-target="#form_modal"><span class="glyphicon glyphicon-plus"></span> Add Product</button>
  <a class="btn btn-info" href="index.php">Display All</a> 
  <br />
  <br />
  <form method="POST" class="form-inline" action="">
   <select name="date" class="form-control" required="required">
    <option value="">Select Month</option>
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
   </select>
   <button class="btn btn-primary" name="filter"><span class="glyphicon glyphicon-search"></span> Search</button>
  </form>
  <br style="clear:both;"/><br />
  <table class="table table-bordered">
   <thead class="alert-info">
    <tr>
     <th>Product Name</th>
     <th>Supplier Name</th>
     <th>Date</th>
    </tr>
   </thead>
   <tbody>
    <?php include 'filter.php'?>
   </tbody>
  </table>
 </div>
 <div class="modal fade" id="form_modal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog">
   <form action="save.php" method="POST">
    <div class="modal-content">
     <div class="modal-body">
      <div class="col-md-2"></div>
      <div class="col-md-8">
       <div class="form-group">
        <label>Product Name</label>
        <input type="text" class="form-control" name="product_name" required="required"/>
       </div>
       <div class="form-group">
        <label>Supplier Name</label>
        <input type="text" class="form-control" name="supplier_name" required="required"/>
       </div>
       <div class="form-group">
        <label>Date</label>
        <input type="date" class="form-control" name="date" required="required"/>
       </div>
      </div>
     </div>
     <div style="clear:both;"></div>
     <div class="modal-footer">
      <button type="button" class="btn btn-danger" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Close</button>
      <button name="save" class="btn btn-primary"><span class="glyphicon glyphicon-save"></span> Save</button>
     </div>
    </div>
   </form>
  </div>
 </div>
 <script src="js/jquery-3.2.1.min.js"></script>
 <script src="js/bootstrap.js"></script>
</body>
</html> 

filter.php
Script ii berfungsi fungsi inti dari aplikasi sederhana di atas, dimana script ini akan memfilter data bulan sesuai yang kita pilih meudian menampilkannya kedalam tabel.

 <?php
date_default_timezone_set('Asia/Jakarta');
if(!ISSET($_POST['filter'])){
 ?>
 <?php
 require 'config.php';
 $query = mysqli_query($conn, "SELECT * FROM `product` ORDER BY `date` ASC") or die(mysqli_error());
 while($fetch = mysqli_fetch_array($query)){
  ?>
  <tr>
   <td><?php echo $fetch['product_name']?></td>
   <td><?php echo $fetch['supplier']?></td>
   <td><?php echo date('M d, Y', strtotime($fetch['date']))?></td>
  </tr>
  <?php
 }
 ?>
 
 <?php
}
?>


<?php
if(ISSET($_POST['filter'])){
 require 'config.php';
 $date = $_POST['date'];
 $query = mysqli_query($conn, "SELECT * FROM `product` WHERE MONTH(date) = '$date' ORDER BY `date` ASC") or die(mysqli_error());
 while($fetch = mysqli_fetch_array($query)){
  ?>
  <tr>
   <td><?php echo $fetch['product_name']?></td>
   <td><?php echo $fetch['supplier']?></td>
   <td><?php echo date('M d, Y', strtotime($fetch['date']))?></td>
  </tr> 
  <?php  
 }
}
?> 

save.php
Script ini mempunyai fungsi menginput data kedalam database melalui form data-model yang terdapat pada file index.php

 <?php
 require_once 'config.php';
 
 if(ISSET($_POST['save'])){
  $product_name = $_POST['product_name'];
  $supplier_name = $_POST['supplier_name'];
  $date = $_POST['date'];
  
  mysqli_query($conn, "INSERT INTO `product` VALUES('', '$product_name', '$supplier_name', '$date')") or die(mysqli_error());
  
  header('location: index.php');
 }
 
?> 

Kalian bisa langsung melihat demo aplikasi sederhana di atas, Kalian juga bisa langsung medownload file dibawah ini.

DEMO        DOWNLOAD

Sekian share kali ini semoga apa yang kami share bermanfaat bagi anda, jika kalian belum paham atau kalian ingin request post dan project silahkan tinggalkan komentar dibawah.


Artikel Menarik Lainnya

SUBSCRIBE TO OUR NEWSLETTER