Home » Codeigniter,Database » Mengubah dd mm yyyy Format ke yyyy mm dd Codeigniter

Mengubah dd mm yyyy Format ke yyyy mm dd Codeigniter

Published by Ade Kurniawan on

Format dd mm yyyy adalah format yang biasa digunakan untuk menampilkan tanggal di indonesia. Dalam Penggunaan format date memang terdapat berbagai perbedaan di beberapa negara. Format date di amerika menggunakan MM dd yyyy dibeberapa negara lainnya menggunakan dd mm yyyy. Oleh karenanya dalam penggunakan format datepicker dibutuhkan sebuah library yang komplit. Dengan library yang komplit dapat menyesuaikan dengan berbagai keperluan. Dibalik format penyimpanan yang berbeda tersebut SQL database menggunakan format berbentuk yyyy-mm-dd untuk menyimpan date dalam bentuk byte. Hal ini mengharuskan setiap format date baik dalam bentuk dd-mm-yyyy, dd/mm/yyyy, dd MM YYYY , DD/MM/YYYY ataupun yang lainnya harus di ubah ke bentuk yyyy-mm-dd agar bisa tersimpan di database.

date format dd/mm/yyyy
date format dd/mm/yyyy

JQuery memiliki banyak keunggulan untuk mempermudah penanganan file dan proses di html, khusus untuk menangani format date ini sudah disedikan fungsi datepicker dan fungsi datetimepicker.

Datepicker dan datetimepicker memberikan format date yang dibutuhkan dan lebih lengkap dari pada date yang terdapat pada bawaan mozila ataupun google chrome, selanjutnya dengan menggunakan JQuery ui datepicker dan datetimepicker dapat mengatasi perbedaan format dan bahasa tanggal di macam-macam negara kita bisa menggunakan fungsi locale. Untuk memahami penggunaan datetimepicker kita cobakan membuat datapicker menampilkan format dd/mm/yyyy, dd-mm-yyyy untuk memilih tanggal, kemudian format mm-yyyy untuk menampilkan data bulanan.

1. Membuat dan menyimpan datepicker format dd/mm/yyyy di database

Untuk membuat date picker format dd/mm/yyyy di database silahkan ikuti langkah berikut:

1.buatlah database baru di database disini dibuat indonetsource dan buat tabel datetimepicker sebagai berikut:

CREATE TABLE datetimepicker (
id int(11) NOT NULL AUTO_INCREMENT,
nama varchar(50) NOT NULL,
tgl_lahir date DEFAULT NULL,
PRIMARY KEY (id)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=latin1

2. Buatlah file M_date.php di folder model sebagai berikut:

M_date.php

<?php 
class M_date extends CI_Model{

	public function input($table,$data){
		return $this->db->insert($table,$data);
	}

	public function get_datetimepicker(){
		$this->db->select('*');
		$this->db->from('datetimepicker');		
		return $this->db->get();
	}

	public function get_datetimepicker_id(){
		$this->db->select('*');
		$this->db->from('datetimepicker_id');		
		return $this->db->get();
	}

	public function get_filter_month_year($data_month) {
		$this->db->select('*');
		$this->db->from('datetimepicker_id');		
		$this->db->where("date_format(tgl_lahir,'%m-%Y')",$data_month);		
	return $this->db->get();
	}
}

3. Buatlah Controller Sebagai berikut:

Date_format.php

<?php 
class Date_format extends CI_Controller{
	
	function __construct()
	{
		parent::__construct();	
		$this->load->model('m_date');
	}
 
	public function format1(){
		$data['datetimepicker'] = $this->m_date->get_datetimepicker()->result();		
		$this->load->view('view_date1',$data);
	}

	public function format2(){
		$data['datetimepicker_id'] = $this->m_date->get_datetimepicker_id()->result();		
		$this->load->view('view_date2',$data);
	}

	public function datetimepicker(){
		$nama = $this->input->post('nama');	
		$tgl = $this->input->post('tgl_lahir'); $tgl1 = str_replace('/', '-', $tgl);
		$tgl_lahir = date("Y-m-d", strtotime($tgl1)); // Mengubah format dd/mm/yy ke Y-m-d sesuai format date SQL	
		$data = array(
				'nama' => $nama,
				'tgl_lahir' => $tgl_lahir
		);
		$this->m_date->input('datetimepicker',$data);
		redirect('date_format/format1');
	}

	public function datetimepicker_id(){
		$nama = $this->input->post('nama');
		$tgl = $this->input->post('tgl_lahir');		
		$tgl_lahir = date("Y-m-d", strtotime($tgl));// Mengubah format dd-mm-yy ke Y-m-d sesuai format date SQL		

		$data = array(
				'nama' => $nama,
				'tgl_lahir' => $tgl_lahir
		);

		$this->m_date->input('datetimepicker_id',$data);
		redirect('date_format/format2');
	}

	public function filter_month_year(){			
		$data_month = $this->input->post('data_month');
		$data['data_month']	= $data_month;		
		$data['data_bulanan'] = $this->m_date->get_filter_month_year($data_month)->result();
		$this->load->view('view_date_filter',$data);			
	}
}

3. Buatlah file view_date1.php di folder views sebagai berikut

view_date1.php

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="icon" href="<?=base_url()?>/bootstrap/images/indonetsource.ico" type="image/gif">
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/font-awesome/css/font-awesome.min.css')?>">     
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/easion.css');?>">   
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/newdatepicker/css/bootstrap-datetimepicker.css')?>"/>
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/dist/css/bootstrap.min.css')?>"/> 
    <title>Indonetsource - Date format Codeigniter</title>
</head>

<body>
    <div class="dash">
        <div class="dash-nav dash-nav-dark">
            <header>
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="https://www.indonetsource.com/" class="easion-logo" target="_blank" ><img width="30px" src="<?php echo base_url('bootstrap/images/indonetsource.png') ?>"><span>&nbspIndonetsource</span></a>
            </header>
            <nav class="dash-nav-list">
                <a href="https://www.indonetsource.com/mengubah-dd-mm-yyyy-format-ke-yyyy-mm-dd-jquery-codeigniter/" target="_blank" class="dash-nav-item">
                    <i class="fa fa-home"></i> Dashboard </a>
                <div class="dash-nav-dropdown">
                    <a href="#" class="dash-nav-item dash-nav-dropdown-toggle">
                        <i class="fa fa-server"></i> Example</a>
                    <div class="dash-nav-dropdown-menu">
                        <a href="<?php echo base_url('date_format/format1') ?>" class="dash-nav-dropdown-item">Format 1</a>
                        <a href="<?php echo base_url('date_format/format2') ?>" class="dash-nav-dropdown-item">Format 2</a>
                        <a href="<?php echo base_url('date_format/filter_month_year') ?>" class="dash-nav-dropdown-item">Date Filter Bulanan</a>
                    </div>
                </div>
            </nav>
        </div>
        <div class="dash-app">
            <header class="dash-toolbar">
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="#!" class="searchbox-toggle">
                    <i class="fa fa-search"></i>
                </a>
                <form class="searchbox" action="#!">
                    <a href="#!" class="searchbox-toggle"> <i class="fa fa-arrow-left"></i> </a>
                    <button type="submit" class="searchbox-submit"> <i class="fa fa-search"></i> </button>
                    <input type="text" class="searchbox-input" placeholder="type to search">
                </form>
                <div class="tools">
                    <a href="#!" class="tools-item">
                        <i class="fa fa-bell"></i>                        
                    </a>
                    <div class="dropdown">
                        <a href="#" class="tools-item" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-user"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenu1">
                            <a class="dropdown-item" href="#">hello...!!</a>
                        </div>
                    </div>
                </div>
            </header>
            <main class="dash-content">
                <div class="container-fluid">
                    <div class="card easion-card">
                        <div class="card-header">
                            <div class="easion-card-icon">
                                <i class="fa fa-edit"></i>
                            </div>
                            <div class="easion-card-title"> Input Date Format dd/mm/yyyy</div>
                        </div>
                        <div class="card-body">
                            <form action="date_format/datetimepicker" method="post" enctype="multipart/form-data">
                                <div class="form-group">                                    
                                    <label  for="">Nama</label>                                    
                                    <div class="input-group col-sm-3">
                                        <input type="text" name="nama" class="form-control"  placeholder="Nama">
                                    </div>
                                </div>
                                <div class="form-group">                                      
                                    <label for="">Tanggal Lahir</label>
                                    <div id="tgl1" class="input-group col-sm-3">
                                        <input type="text" name="tgl_lahir" class="form-control" required/>  
                                        <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
                                    </div>                                    
                                </div>  
                                <div class="form-group">
                                    <button type="submit" class="btn btn-primary  btn-sm submit-reset">Simpan </button>                                                
                                </div>  
                            </form>                      
                            <table class="table table-bordered">
                               <tr>
                                   <th>No</th>
                                   <th>Nama</th>
                                   <th>Tanggal Lahir Format dd/mm/yyyy</th>                                   
                               </tr>
                               <?php 
                                $no = 1;
                               foreach ($datetimepicker as $key ): ?>
                                <tr>
                                    <td><?php echo $no++ ?></td>
                                    <td><?php echo $key->nama; ?></td>
                                    <td><?php $date = date_create($key->tgl_lahir); echo date_format($date, "d/m/Y");?></td>                                    
                                </tr>
                               <?php endforeach ?>
                           </table>
                        </div>
                     </div>
                </div>
            </main>
        </div>
    </div>
    <script src="<?php echo base_url('bootstrap/js/jquery-3.3.1.slim.min.js')?>" ></script>
    <script src="<?php echo base_url('bootstrap/js/popper.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/bootstrap.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/easion.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/moment-with-locales.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/jquery-1.11.3.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap-datetimepicker.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap.min.js')?>"></script>

    <script>
      $(function() { 
        $('#tgl1').datetimepicker({format : "DD/MM/YYYY"});
        $('#tgl2').datetimepicker({format : "DD/MMM/YYYY"});
        $('#tgl3').datetimepicker({format : "DD/MMMM/YYYY"});
       
        $('#tgl4').datetimepicker({
         locale:'id',
         format:'DD-MM-YYYY'
         });
        $('#tgl5').datetimepicker({
         locale:'id',
         format:'DD/MMMM/YYYY'
         });
         $('#tgl6').datetimepicker({
         locale:'id',
         format:'DD-MMMM-YYYY'
         });
      });
    </script> 
</body>

</html>

Setelah membuat view di atas kita telah menyelesaikan pembuatan datepicker format dd/mm/yyyy dan menyimpannya di database silahkan akses di localhost url http://localhost/indonetsource/date_format/format1 untuk melihat hasilnya. jika berhasil maka hasilnya akan sama seperti yang ada di demo.

2. Membuat dan menyimpan datepicker format dd-mm-yyyy locale id ke database.

Membuat datepicker format dd-mm-yyyy ini hampir sama dengan yang di atas hanya saja kita perlu menambahkan tabel baru di database dan view view_date2. Silahkan klik tombol demo untuk melihat hasil dari program yang akan kita buat.

Untuk membuat date menyimpan datetimpicker di sql database sesuai demo tersebut silahkan ikut langkah berikut:

1. Buat tabel baru dengan nama datetimpicker_id sebagai berikut:

CREATE TABLE `datetimepicker_id` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `nama` varchar(50) NOT NULL,
 `tgl_lahir` date DEFAULT NULL,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=8 DEFAULT CHARSET=latin1

Setelah memiliki database kita membuat view untuk model dan controller tidak perlu lagi karena sudah di buat pada contoh sebelumnya

2. Tambahkan view_date2.php di views

view_date2.php

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="icon" href="<?=base_url()?>/bootstrap/images/indonetsource.ico" type="image/gif">
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/font-awesome/css/font-awesome.min.css')?>">     
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/easion.css');?>">   
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/newdatepicker/css/bootstrap-datetimepicker.css')?>"/>
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/dist/css/bootstrap.min.css')?>"/> 
    <title>Indonetsource - Date format Codeigniter</title>
</head>

<body>
    <div class="dash">
        <div class="dash-nav dash-nav-dark">
            <header>
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="https://www.indonetsource.com/" class="easion-logo" target="_blank" ><img width="30px" src="<?php echo base_url('bootstrap/images/indonetsource.png') ?>"><span>&nbspIndonetsource</span></a>
            </header>
            <nav class="dash-nav-list">
                <a href="https://www.indonetsource.com/mengubah-dd-mm-yyyy-format-ke-yyyy-mm-dd-jquery-codeigniter/" target="_blank" class="dash-nav-item">
                    <i class="fa fa-home"></i> Dashboard </a>
                <div class="dash-nav-dropdown">
                    <a href="#" class="dash-nav-item dash-nav-dropdown-toggle">
                        <i class="fa fa-server"></i> Example</a>
                    <div class="dash-nav-dropdown-menu">
                        <a href="<?php echo base_url('date_format/format1') ?>" class="dash-nav-dropdown-item">Format 1</a>
                        <a href="<?php echo base_url('date_format/format2') ?>" class="dash-nav-dropdown-item">Format 2</a>
                        <a href="<?php echo base_url('date_format/filter_month_year') ?>" class="dash-nav-dropdown-item">Date Filter Bulanan</a>
                    </div>
                </div>
            </nav>
        </div>
        <div class="dash-app">
            <header class="dash-toolbar">
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="#!" class="searchbox-toggle">
                    <i class="fa fa-search"></i>
                </a>
                <form class="searchbox" action="#!">
                    <a href="#!" class="searchbox-toggle"> <i class="fa fa-arrow-left"></i> </a>
                    <button type="submit" class="searchbox-submit"> <i class="fa fa-search"></i> </button>
                    <input type="text" class="searchbox-input" placeholder="type to search">
                </form>
                <div class="tools">
                    <a href="#!" class="tools-item">
                        <i class="fa fa-bell"></i>                        
                    </a>
                    <div class="dropdown">
                        <a href="#" class="tools-item" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-user"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenu1">
                            <a class="dropdown-item" href="#">hello...!!</a>
                        </div>
                    </div>
                </div>
            </header>
            <main class="dash-content">
                <div class="container-fluid">
                    <div class="card easion-card">
                        <div class="card-header">
                            <div class="easion-card-icon">
                                <i class="fa fa-edit"></i>
                            </div>
                            <div class="easion-card-title"> Input Date format dd-mm-yyyy locale id </div>
                        </div>
                        <div class="card-body">
                            <form action="date_format/datetimepicker_id" method="post" enctype="multipart/form-data">
                                <div class="form-group">                                    
                                    <label  for="">Nama</label>                                    
                                    <div class="input-group col-sm-3">
                                        <input type="text" name="nama" class="form-control"  placeholder="Nama">
                                    </div>
                                </div>
                                <div class="form-group">                                      
                                    <label for="">Tanggal Lahir</label>
                                    <div id="tgl4" class="input-group col-sm-3">
                                        <input type="text" name="tgl_lahir" class="form-control" required/>  
                                        <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
                                    </div>                                                                           
                                </div>    
                                <div class="form-group">                     
                                     <button type="submit" class="btn btn-primary  btn-sm submit-reset">Simpan </button>                                                                                    
                                </div>
                            </form>                                                          
                            <table class="table table-bordered">
                               <tr>
                                   <th>No</th>
                                   <th>Nama</th>
                                   <th>Tanggal Lahir format dd-mm-yyyy locale id</th>                                   
                               </tr>
                               <?php 
                                $no = 1;
                               foreach ($datetimepicker_id as $key ): ?>
                                <tr>
                                    <td><?php echo $no++ ?></td>
                                    <td><?php echo $key->nama; ?></td>
                                    <td><?php $date = date_create($key->tgl_lahir); echo date_format($date, "d-m-Y");?></td>                                    
                                </tr>
                               <?php endforeach ?>
                           </table>
                        </div>
                     </div>
                </div>
            </main>
        </div>
    </div>
    <script src="<?php echo base_url('bootstrap/js/jquery-3.3.1.slim.min.js')?>" ></script>
    <script src="<?php echo base_url('bootstrap/js/popper.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/bootstrap.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/easion.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/moment-with-locales.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/jquery-1.11.3.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap-datetimepicker.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap.min.js')?>"></script>

    <script>
      $(function() { 
        $('#tgl1').datetimepicker({format : "DD/MM/YYYY"});
        $('#tgl2').datetimepicker({format : "DD/MMM/YYYY"});
        $('#tgl3').datetimepicker({format : "DD/MMMM/YYYY"});
       
        $('#tgl4').datetimepicker({
         locale:'id',
         format:'DD-MM-YYYY'
         });
        $('#tgl5').datetimepicker({
         locale:'id',
         format:'DD/MMMM/YYYY'
         });
         $('#tgl6').datetimepicker({
         locale:'id',
         format:'DD-MMMM-YYYY'
         });
      });
    </script> 
</body>

</html>

Dengan menambahkan tabel dan view di atas kita telah berhasil membuat dan menyimpan datepicker format dd-mm-yyyy ke database. silahkan akses url http://localhost/indonetsource/date_format/format2 untuk melihat hasilnya.

3. Menampilkan data datepicker

Tanggal Format mm-yyyy dibutuhkan ketika kita ingin menampilkan data bulanan sehingga pada datepicker kita membutuhkan input bulan dan tahun seperti gambar berikut:

filter data bulanan dan tahunan datetimepicker

Gambar filter data bulanan dan tahunan menggunakan JQuery di atas menggunakan locale id dan ditampilkan dari database ke tabel menggunakan format dd-mm-yyyy sesuai yang ada di indonesia. Silahkan lihat demo berikut untuk melihat hasil dari script program tanggal ini.

Membuat format ini kita masih menggunakan database, model dan controller yang sebelumnya hanya saja kita perlu menambahkan views sebagai berikut:

1. Tambahkan view_date_filter.php di views sebagai berikut:

view_date_filter.php

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="icon" href="<?=base_url()?>/bootstrap/images/indonetsource.ico" type="image/gif">
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/font-awesome/css/font-awesome.min.css')?>"> 
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/easion.css');?>">   
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/newdatepicker/css/bootstrap-datetimepicker.css')?>"/>
    <link rel="stylesheet" href="<?php echo base_url('bootstrap/dist/css/bootstrap.min.css')?>"/> 
    <title>Indonetsource - Month Filter Codeigniter</title>
</head>

<body>
    <div class="dash">
        <div class="dash-nav dash-nav-dark">
            <header>
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="https://www.indonetsource.com/" class="easion-logo" target="_blank"><img width="30px" src="<?php echo base_url('bootstrap/images/indonetsource.png') ?>"><span>&nbspIndonetsource</span></a>
            </header>
            <nav class="dash-nav-list">
                <a href="https://www.indonetsource.com/upload-image-file-random-name-codeigniter/" target="_blank" class="dash-nav-item">
                    <i class="fa fa-home"></i> Dashboard </a>
                <div class="dash-nav-dropdown">
                    <a href="#" class="dash-nav-item dash-nav-dropdown-toggle">
                        <i class="fa fa-server"></i> Example</a>
                    <div class="dash-nav-dropdown-menu">
                       <a href="<?php echo base_url('date_format/format1') ?>" class="dash-nav-dropdown-item">Format 1</a>
                       <a href="<?php echo base_url('date_format/format2') ?>" class="dash-nav-dropdown-item">Format 2</a>
                       <a href="<?php echo base_url('date_format/filter_month_year') ?>" class="dash-nav-dropdown-item">Date Filter Bulanan</a>
                    </div>
                </div>
            </nav>
        </div>
        <div class="dash-app">
            <header class="dash-toolbar">
                <a href="#" class="menu-toggle">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="#!" class="searchbox-toggle">
                    <i class="fa fa-search"></i>
                </a>
                <form class="searchbox" action="#!">
                    <a href="#!" class="searchbox-toggle"> <i class="fa fa-arrow-left"></i> </a>
                    <button type="submit" class="searchbox-submit"> <i class="fa fa-search"></i> </button>
                    <input type="text" class="searchbox-input" placeholder="type to search">
                </form>
                <div class="tools">
                    <a href="#!" class="tools-item">
                        <i class="fa fa-bell"></i>                        
                    </a>
                    <div class="dropdown">
                        <a href="#" class="tools-item" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-user"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-left" aria-labelledby="dropdownMenu1">
                            <li>
                            <a class="dropdown-item" href="#">hello.!!</a>
                          </li>
                        </div>
                    </div>
                </div>
            </header>
            <main class="dash-content">
                <div class="container-fluid">
                    <div class="card easion-card">
                        <div class="card-header">
                            <div class="easion-card-icon">
                                <i class="fa fa-edit"></i>
                            </div>
                            <div class="easion-card-title"> Filter Data Bulanan dan Tahunan </div>
                        </div>
                        <div class="card-body">
                            <form action="<?php echo base_url('date_format/filter_month_year')?>" method="post">
                                <div class="form-group">                                      
                                    <label for="">Tanggal Lahir</label>
                                    <div id="tgl7" class="input-group col-sm-3">
                                        <input type="text" name="data_month" class="form-control" required/>  
                                        <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span>
                                    </div>                                                                           
                                </div>    
                                <div class="form-group">                     
                                     <button type="submit" class="btn btn-primary  btn-sm submit-reset">Lihat </button>                                                                                
                                </div>
                            </form> 
                            <?php 
                            echo $data_month;?>                                                         
                            <table class="table table-bordered">
                               <tr>
                                   <th>No</th>
                                   <th>Nama</th>
                                   <th>Tanggal Lahir format dd-mm-yyyy locale id</th>                                
                               </tr>
                               <?php 
                                $no = 1;
                               foreach ($data_bulanan as $key ): ?>
                                <tr>
                                    <td><?php echo $no++ ?></td>
                                    <td><?php echo $key->nama; ?></td>
                                    <td><?php $date = date_create($key->tgl_lahir); echo date_format($date, "d-m-Y");?></td>                                    
                                </tr>
                               <?php endforeach ?>
                           </table>
                        </div>
                     </div>
                </div>
            </main>
        </div>
    </div>
    <script src="<?php echo base_url('bootstrap/js/jquery-3.3.1.slim.min.js')?>" ></script>
    <script src="<?php echo base_url('bootstrap/js/popper.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/bootstrap.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/js/easion.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/moment-with-locales.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/jquery-1.11.3.min.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap-datetimepicker.js')?>"></script>
    <script src="<?php echo base_url('bootstrap/newdatepicker/js/bootstrap.min.js')?>"></script>

    <script>
      $(function() { 
        $('#tgl1').datetimepicker({format : "DD/MM/YYYY"});
        $('#tgl2').datetimepicker({format : "DD/MMM/YYYY"});
        $('#tgl3').datetimepicker({format : "DD/MMMM/YYYY"});
       
        $('#tgl4').datetimepicker({
         locale:'id',
         format:'DD-MM-YYYY'
         });
        $('#tgl5').datetimepicker({
         locale:'id',
         format:'DD/MMMM/YYYY'
         });
         $('#tgl6').datetimepicker({
         locale:'id',
         format:'DD-MMMM-YYYY'
         });    
         $('#tgl7').datetimepicker({
           locale:'id',
           format:'MM-YYYY'
           });         
      });
    </script> 
</body>

</html>

Pada view_date_filter.php ini dan dan view_date2.php kita menggunakan format #tgl4, #tgl7 yang berbentuk DD-MM-YYYY MM-YYYY locale id. Format #tgl4 dan #tgl7 ditambahkan dengan menuliskan local id sehingga kita memanggil format tanggal dalam bentuk hari senin, selasa….dst dan bulan dalam bentuk januari,februari…….dst menggunakan bahasa indonesia.


0 Comments

Leave a Reply

Avatar placeholder

Your email address will not be published. Required fields are marked *