Mencegah Pengguna Memilih Tanggal yang Sudah Lewat di DateTimePicker pada PHPMaker 2021

Satu lagi kemudahan di PHPMaker 2021 yang akan kita kupas di artikel ini, yaitu bagaimana cara mencegah Pengguna memilih tanggal-tanggal yang sudah lewat pada control DateTimePicker.

Seperti yang kita ketahui, PHPMaker 2021 menggunakan Extension DateTimePicker dari Bootstrap Date/Time Picker untuk membantu Pengguna memilih tanggal saat menginput data.

Tulisan ini mirip dengan artikel yang saya tulis sekitar 5 tahun yang lalu, yaitu Mencegah Pengguna Memilih Tanggal yang Sudah Lewat di JSCalendar dari PHPMaker.

Kalau Anda perhatikan di artikel tadi, ada lumayan banyak kode yang harus kita sesuaikan untuk mencegah Pengguna memilih tanggal-tanggal yang sudah lewat pada Extension JSCalendar. Entah apakah karena saat itu Extension yang digunakan memiliki keterbatasan dibandingkan dengan Extension DateTimePicker untuk PHPMaker 2021.

Tapi yang jelas, di Extension DateTimePicker untuk PHPMaker 2021 ini, kita bisa mengimplementasikannya dengan sangat mudah dan cepat. Tidak perlu lagi menulis kode sebanyak yang kita tulis 5 tahun lalu itu. Hanya dengan sedikit kode saja, kita sudah bisa menerapkannya dengan sangat mudah dan cepat.

Katakanlah kita ingin membatasi Pengguna Akhir untuk memilih tanggal-tanggal yang sudah lewat pada field OrderDate di table orderdetails dari project demo2021 yang bisa di-download dan coba di komputer kita masing-masing.

Cukup dengan memasukkan kode di bawah ini dari lokasi berikut pada project PHPMaker 2021: Tools -> Extensions -> DateTimePicker -> Advanced -> Fields -> Tables -> orders -> OrderDate -> Options:

{"minDate":[]}

Karena PHPMaker 2021 menggunakan Moment JS untuk mengimplementasikan fitur yang terkait dengan Tanggal dan pemakaian DateTimePicker, maka kita cukup menambahkan opsi minDate, dengan nilai [], yang artinya itu adalah tanggal hari ini di Moment JS.

Setelah itu, simpan file demo project tadi, generate ulang semua file script seperti biasa dengan menggunakan PHPMaker 2021.

Ketika kita mencoba menambah data di table orders lalu memilih tanggal pada field OrderDate, maka DateTimePicker akan menampilkan tanggal-tanggal yang telah lewat menjadi dalam posisi disabled atau non aktif.

Itu artinya, kode di atas berhasil mencegah Pengguna Akhir untuk memilih tanggal-tanggal yang telah lewat. Tanggal minimal yang boleh dipilih adalah tanggal hari ini. Tentu saja karena tanggal hari ini yang minimal, kita bisa juga memilih tanggal-tanggal yang akan datang.

Sampai di sini misi awal kita sudah selesai, yaitu hanya sebatas mencegah Pengguna memilih tanggal-tanggal yang telah lewat dari control DateTimePicker.

Tapi misi keseluruhan masih belum selesai. Maksudnya?

Jadi begini. Kalau Anda perhatikan setelah kita memilih tanggal hari ini, maka setelah DateTimePicker kita tutup, kita masih bisa mengganti tanggal tersebut menjadi tanggal yang telah lewat secara langsung dengan mengetik pada field OrderDate. Jika data tersebut disimpan, itu artinya data tanggal yang telah lewat masih lolos masuk ke database.

Pertanyaan selanjutnya, bagaimana cara mencegah supaya data tanggal yang telah lewat yang diubah secara langsung di field OrderDate tadi (tanpa melalui bantuan DateTimePicker) bisa dicegah masuk ke database?

Jawabannya sangatlah mudah dan juga sangat cepat. Cukup dengan memasukkan sedikit kode berikut ke dalam server event Row_Inserting:

if (strtotime($rsnew["OrderDate"]) < strtotime(CurrentDateTime())) {
    $this->setFailureMessage("Order Date cannot be lower than today!");
    return false;
}

Kode ini untuk mencegah Pengguna Akhir menyimpan data tanggal yang sudah lewat. Jika data yang dimasukkan secara langsung ke field OrderDate tanpa bantuan control DateTimePicker, maka masih ada benteng terakhir yang kita gunakan untuk memvalidasi data tanggal tersebut.

Terbukti sudah, di versi terakhir, selalu saja ada peningkatan fitur yang memungkinkan Web Developer dapat bekerja secara lebih efektif dan efisien. Tidak perlu banyak kode yang kita tulis. Kita pun masih tetap bisa mengkombinasikan kode di sisi client dan di sisi server.

Hanya dengan sedikit kode itu saja, maka kita sudah bisa mencegah Pengguna Akhir untuk memilih tanggal-tanggal yang telah lewat dari control DateTimePicker, dan juga memvalidasi tanggal di sisi server melalui bantuan server event Row_Inserting.