Validasi Formulir CodeIgniter dengan Contoh Pengiriman Formulir

Formulir di CodeIgniter

Formulir menyediakan cara bagi pengguna untuk berinteraksi dengan aplikasi dan mengirimkan data. Formulir dapat digunakan untuk formulir hubungi kami yang dapat diisi oleh pengunjung situs web dan mengirimkan informasinya kepada kami. Informasi yang diterima biasanya disimpan dalam basis data atau dikirim melalui email.

Struktur Formulir HTML

Kode berikut menunjukkan struktur formulir HTML yang umum.

<form id="frmUsers" name="frmUsers" method="POST" action="create_user.php">
	<input type="text" id="user_id" name="user_id">
	<input type="password" id="password" name="password">

	<input type="submit" value="Submit">
</form>

SINI,

… adalah tag pembuka dan penutup formulir. Atribut id dan name menentukan nama dan id formulir. Atribut metode menentukan Kata Kerja HTTP yang akan digunakan. Ini biasanya ditentukan oleh kata kerja POST
Menentukan elemen formulir. Atribut nama adalah nama variabel yang dikirimkan ke server backend untuk diproses.

Pembantu Formulir CodeIgniter

HTML itu bagus, mudah dimengerti dan ditulis, tapi CodeIgniter membuat segalanya menjadi lebih sederhana. CodeIgniter memiliki fungsi bawaan untuk membuat formulir HTML.

Mari kita pertimbangkan kode pengiriman formulir CodeIgniter berikut yang menggunakan pembantu formulir untuk membuat formulir

 <?php
        echo form_open('create_user.php', ['id' => 'frmUsers']);
        
        echo form_label('User Id', 'user_id');
        echo form_input(['name' => 'user_id']);
        
        echo form_label('Password', 'password');
        echo form_input(['type' => 'password', 'name' => 'password']);
        
        echo form_submit('btnSubmit', 'Create User');
        
        echo form_close();
        ?>

SINI,

echo form_open('buat_pengguna.php', ['id' => 'frmUsers']); membuat tag pembuka formulir, menyetel tindakan ke POST Verb, dan menyetel URL tindakan ke create_user.php
echo form_label('ID Pengguna', 'ID_Pengguna'); membuat label bertuliskan User Id untuk kolom input dengan nama user_id.
echo form_input(['nama' => 'id_pengguna']); membuat kolom input tipe teks dengan nama user_id
echo form_submit('btnSubmit', 'Buat Pengguna'); membuat tombol kirim dengan label Buat Pengguna
gema form_close(); menutup formulir

Seperti yang terlihat dari kode CodeIgniter di atas, form helper memudahkan kita membuat form menggunakan PHP murni. Dengan meneruskan atribut ke metode pembantu formulir, kita dapat menyesuaikan HTML yang dihasilkan untuk formulir.

Kode di atas menghasilkan kode formulir HTML berikut

        <form action="http://localhost:3000/index.php/create_user.php" id="frmUsers" method="post" accept-charset="utf-8">
            <label for="user_id">User Id</label>
            <input type="text" name="user_id" value=""/>

            <label for="password">Password</label>
            <input type="password" name="password" value=""/>

            <input type="submit" name="btnSubmit" value="Create User"/>
        </form>

Keuntungan terbesar menggunakan form helper adalah ia menghasilkan kode yang benar secara semantik dan mematuhi standar HTML yang ditetapkan.

Anda dapat merujuk ke dokumentasi resmi CodeIgniter untuk detail lebih lanjut

https://codeigniter.com/user_guide/helpers/form_helper.html

Contoh Formulir CodeIgniter

Setelah membahas dasar-dasar CodeIgniter, mari kembali ke proyek tutorial yang telah kita kerjakan selama ini Seri Tutorial CodeIgniterSingkatnya, proyek tutorial ini membangun aplikasi manajemen kontak yang akan menyimpan detailnya dalam basis data.

Buat Kontak

dalam tutorial sebelumnya, kita membuat rute untuk aplikasi dan tampilan sederhana kita. Buka aplikasi/views/contacts/create.php

Ubah kode untuk create.php sebagai berikut

<div class="column">
    <h2 class="title">Create Contact</h2>
    <form action="<?= base_url('contacts/store') ?>" method="POST">
        <div class="field">
            <label class="label">Contact Name</label>
            <div class="control">
                <input id="name" name="name" class="input" type="text" placeholder="Type the contact name">
            </div>
        </div>
        <div class="field">
            <label class="label">Contact Number</label>
            <div class="control">
                <input id="name" name="name" class="input" type="text" placeholder="Type the contact number">
            </div>
        </div>
        <div class="field">
            <label class="label">Email Address</label>
            <div class="control">
                <input id="email" name="email" class="input" type="email" placeholder="Type the email address">
            </div>
        </div>
        <div class="field is-grouped">
            <div class="control">
                <button class="button is-link">Save Contact</button>
            </div>
        </div>
    </form>
</div>

Catatan: kode di atas menggunakan HTML biasa untuk membuat formulir.

Sekarang mari kita lihat seperti apa formulir kita di browser web

Muat URL berikut ke peramban web kami.

http://localhost:3000/contacts/create

Jika Anda telah membuat proyek tutorial, maka Anda seharusnya dapat melihat yang berikut ini

Validasi Formulir di CodeIgniter

Validasi memegang peranan yang sangat penting saat memproses data dari formulir. Misalnya, pengguna mendaftar di situs web; kami ingin memastikan bahwa mereka mengisi detail yang diperlukan dan alamat email. Kami perlu memastikan bahwa alamat email yang dimasukkan valid. Jika kami bekerja dengan nilai tanggal, maka kami ingin memastikan rentang tanggalnya valid. Kami tidak perlu menerima tanggal yang memiliki 32 hari dalam sebulan, dsb.

Validasi memecahkan masalah di atas. Validasi CodeIgniter dilakukan pada dua (2) sisi ketika bekerja dengan aplikasi web.

Validasi sisi klien dilakukan pada bagian browser web. Ini biasanya melibatkan penggunaan HTML dan JavaSkrip. Validasi sisi klien meningkatkan kinerja karena semuanya dilakukan di sisi klien. Jadi, tidak perlu mengirimkan data ke server. Kerugian dari validasi sisi klien adalah pengguna memiliki kendali atasnya. Jika Anda mengandalkan JavaSkrip untuk memvalidasi dan pengguna menonaktifkan JavaSkrip di browser, maka validasi Anda akan gagal.

Validasi sisi server dilakukan di sisi server. Kelemahan dari validasi ini adalah pengguna harus mengirimkan data ke server untuk diproses dan menunggu tanggapan. Hal ini menghabiskan sumber daya jaringan dan dapat menurunkan kinerja. Keuntungan utama validasi sisi server adalah Anda memiliki kontrol yang lebih besar dan Anda yakin bahwa aturan validasi Anda berfungsi meskipun pengguna menonaktifkannya. JavaSkrip di peramban.

Strategi yang lebih baik adalah dengan menggunakan sisi klien sebagai strategi validasi utama dan sisi server sebagai mekanisme cadangan.

Menambahkan Aturan Validasi Formulir

CodeIgniter memiliki pustaka validasi bawaan. Pustaka dimuat menggunakan baris berikut

$this->load->library('form_validation');

Pustaka validasi formulir CodeIgniter dapat digunakan untuk melakukan beberapa tindakan berikut

Periksa bidang yang wajib diisi. Ini memeriksa nilai yang dikirimkan dan mengembalikan kesalahan jika bidang yang ditandai sebagai wajib tidak memiliki nilai
Validasi tipe data – beberapa bidang mungkin hanya memerlukan nilai numerik. Jika nilai non-numerik terdeteksi, perpustakaan akan mengembalikan kesalahan. Eksekusi penyerahan formulir juga dibatalkan.
Validasi panjang – beberapa tipe data mengharuskan bidang memiliki jumlah karakter minimum atau maksimum tertentu. Pustaka validasi berguna dalam kasus seperti itu.
Sanitasi data – perpustakaan validasi juga memiliki kemampuan untuk menghapus kode berbahaya dari data yang dikirimkan demi alasan keamanan. Jika misalnya nilai yang dikirimkan sudah aktif JavaSkrip atau kode Injeksi SQL di dalamnya, pustaka validasi menghapus kode yang berbahaya dan menjadikannya tidak berguna.
Validasi bidang basis data yang unik – misalkan Anda memiliki formulir tempat pengguna mendaftar menggunakan alamat email. Anda ingin memastikan bahwa alamat email tersebut unik. Pustaka memudahkan Anda untuk memeriksa data yang dikirimkan terhadap tabel dan bidang basis data. Ini memungkinkan Anda mengetahui bahwa nilai tersebut telah diambil.

Aturan validasi ditetapkan menggunakan format berikut

$this->form_validation->set_rules('field','human readable field','rule',['custom message']);

SINI,

'field' menentukan nama kolom formulir yang akan divalidasi oleh perpustakaan
'bidang yang dapat dibaca manusia' menentukan format bidang yang dapat dibaca manusia dalam validasi. Ini ditampilkan kembali kepada pengguna ketika terjadi kesalahan.
'aturan' menentukan aturan validasi yang akan diterapkan seperti wajib, numerik, periksa apakah panjang minimum adalah… dll.
['pesan khusus'] bersifat opsional dan dapat digunakan untuk menyetel pesan validasi khusus yang harus ditampilkan ketika aturan validasi gagal.

Berikut ini adalah contoh form submit di CodeIgniter untuk memvalidasi nama kontak

$this->form_validation->set_rules('contact_number', 'Contact Number', 'required');

SINI,

Kode di atas memeriksa apakah bidang contact_number telah dimasukkan. Jika tidak disetel maka akan muncul kesalahan yang mengatakan kolom Nomor Kontak wajib diisi.

Untuk menjalankan validasi terhadap aturan yang ditetapkan, kami menggunakan fungsi pustaka validasi berikut

$this->form_validation->run()

Jika kode di atas mengembalikan nilai salah, maka satu atau lebih aturan yang ditetapkan telah gagal. Jika hasilnya benar, maka semua aturan validasi telah berlalu, dan Anda dapat melanjutkan dengan tindakan lebih lanjut.

Mari kita lihat lebih banyak contoh aturan validasi. Misalkan Anda ingin memvalidasi beberapa kolom, misalnya nama kontak, nomor, dan alamat email, Anda dapat menggunakan kode berikut untuk melakukannya.

$rules = array(
        array(
                'field' => 'contact_name',
                'label' => 'Contact Name',
                'rules' => 'required'
        ),
        array(
                'field' => 'contact_number',
                'label' => 'Contact Number',
                'rules' => 'required',
                'errors' => array(
                        'required' => 'You must provide a %s.',
                ),
        ),
        array(
                'field' => 'email_address',
                'label' => 'Email Address',
                'rules' => 'required'
        )
);

$this->form_validation->set_rules($rules);

SINI,

Dalam contoh validasi email di CodeIgniter di atas, kami menyediakan serangkaian kolom dengan aturan untuk fungsi set_rules dari pustaka. Ini memudahkan saat Anda memvalidasi beberapa kolom.

Validasi Unik

Jika kita ingin memvalidasi nomor kontak untuk memastikan bahwa kita tidak menyimpan nomor yang sama dua kali, kita dapat menggunakan aturan berikut untuk melakukannya.

$this->form_validation->set_rules('contact_number', 'Contact Number','required|is_unique[contacts.contact_number]');

SINI,

| digunakan untuk menyalurkan beberapa aturan secara bersamaan
is_unique[contacts.contact_number] memeriksa apakah nilai contact_number unik terhadap nilai bidang contact_number di tabel database kontak.

Menampilkan Pesan Kesalahan Validasi Formulir

Jika terjadi kesalahan selama pemrosesan formulir, Anda dapat menggunakan kode berikut untuk menampilkan kesalahan validasi yang terjadi

<?php echo validation_errors(); ?>

SINI,

Fungsi di atas mengembalikan semua kesalahan yang terjadi.

Mengisi Data Formulir yang Dikirim: Formulir Lengket

Beberapa formulir memiliki banyak kolom, dan jika terjadi kesalahan, Anda perlu memastikan bahwa data yang ditambahkan dengan benar tetap tersimpan. Pustaka validasi memiliki mekanisme untuk melakukannya. Kami melakukannya dengan menggunakan kode berikut.

<?php echo set_value('field_name'); ?>

SINI,

Kode di atas menampilkan input yang dimasukkan pengguna.

Untuk panduan referensi lengkap tentang metode yang tersedia di perpustakaan validasi, Anda dapat merujuk ke dokumentasi API dari panduan pengguna resmi CodeIgniter

https://codeigniter.com/userguide3/libraries/form_validation.html

Contoh Validasi Formulir CodeIgniter

Sepanjang seri tutorial ini, kami telah menambahkan lebih banyak kode ke proyek tutorial kami yang merupakan aplikasi manajemen kontak. Di bagian ini, kita akan memuat perpustakaan validasi dan melihat bagaimana kita dapat menerapkannya secara praktis menggunakan contoh aplikasi dunia nyata.

Ubah kode rute sebagai berikut untuk memasukkan metode penyimpanan

$route['default_controller'] = 'welcome';
$route['contacts'] = 'contacts';
$route['create'] = 'contacts/create';
$route['store'] = 'contacts/store';
$route['edit/:id'] = 'contacts/edit';
$route['update/:id'] = 'contacts/update';
$route['delete/:id'] = 'contacts/delete';
$routes['users'] = 'welcome/users';

Sekarang mari kita memuat perpustakaan validasi formulir di pengontrol Kontak dan menetapkan beberapa aturan validasi.

Ubah kode seperti yang ditunjukkan pada validasi form di bawah ini dalam contoh CodeIgniter:

<?php

defined('BASEPATH') OR exit('No direct script access allowed');

class Contacts extends CI_Controller {

    public function __construct() {
        parent::__construct();
        $this->load->helper('url', 'form');
        $this->load->library('form_validation');
    }

    public function index() {
        $this->load->view('header');
        $this->load->view('contacts/index');
        $this->load->view('footer');
    }

    public function create() {
        $this->load->view('header');
        $this->load->view('contacts/create');
        $this->load->view('footer');
    }

    public function store() {
        $rules = array(
            array(
                'field' => 'contact_name',
                'label' => 'Contact Name',
                'rules' => 'required'
            ),
            array(
                'field' => 'contact_number',
                'label' => 'Contact Number',
                'rules' => 'required',
                'errors' => array(
                    'required' => 'You must provide a %s.',
                ),
            ),
            array(
                'field' => 'email_address',
                'label' => 'Email Address',
                'rules' => 'required'
            )
        );

        $this->form_validation->set_rules($rules);

        if ($this->form_validation->run() == FALSE) {
            $this->load->view('header');
            $this->load->view('contacts/create');
            $this->load->view('footer');
        } else {
            redirect(base_url('contacts'));
        }
    }

    public function edit($id) {
        $this->load->view('header');
        $this->load->view('contacts/edit');
        $this->load->view('footer');
    }

    public function update($id) {
        $this->load->view('header');
        $this->load->view('contacts/update');
        $this->load->view('footer');
    }

    public function delete($id) {
        $this->load->view('header');
        $this->load->view('contacts/delete');
        $this->load->view('footer');
    }
}

SINI,

$rules = array(…) set mendefinisikan aturan validasi
$ini->validasi_formulir->set_rules($rules); menetapkan aturan validasi
if ($this->form_validation->run() == FALSE) {…} menjalankan aturan validasi dan jika gagal, formulir akan ditampilkan ulang dengan kesalahan validasi. Jika validasi lolos, kita cukup mengarahkan ke halaman daftar kontak. Dalam keadaan normal kami akan menulis data ke database. Kita akan melakukannya di tutorial berikutnya saat kita melihatnya database.

Ubah tampilan buat pada kode application/contacts/create.php seperti yang ditunjukkan pada contoh validasi formulir CodeIgniter di bawah ini:

<div class="column">
    <h2 class="title">Create Contact</h2>
    <div class="notification is-danger">
    <?php echo validation_errors(); ?>
    </div>
    <form action="<?= base_url('contacts/store') ?>" method="POST">
        <div class="field">
            <label class="label">Contact Name</label>
            <div class="control">
                <input id="contact_name" name="contact_name" class="input" type="text" value="<?php echo set_value('contact_name'); ?>" placeholder="Type the contact name">
            </div>
        </div>
        <div class="field">
            <label class="label">Contact Number</label>
            <div class="control">
                <input id="contact_number" name="contact_number" class="input" type="text" value="<?php echo set_value('contact_number'); ?>" placeholder="Type the contact number">
            </div>
        </div>
        <div class="field">
            <label class="label">Email Address</label>
            <div class="control">
                <input id="email_address" name="email_address" class="input" type="email" value="<?php echo set_value('email_address'); ?>" placeholder="Type the email address">
            </div>
        </div>
        <div class="field is-grouped">
            <div class="control">
                <button class="button is-link">Save Contact</button>
            </div>
        </div>
    </form>
</div>

SINI,

kami menampilkan kesalahan yang terjadi jika ada selama proses validasi
menetapkan nilai yang telah ditetapkan sebelumnya jika ada

Anda perlu memuat URL berikut ke dalam peramban web Anda. Kemudian klik Buat Kontak tanpa memasukkan nilai apa pun

Kesimpulan

Formulir menyediakan cara bagi pengguna untuk berinteraksi dengan aplikasi dan mengirimkan data.
HTML itu hebat, mudah dipahami dan ditulis, tetapi CodeIgniter membuatnya lebih sederhana. CodeIgniter memiliki fungsi bawaan untuk membuat formulir HTML.
Validasi memainkan peran yang sangat penting saat memproses data dari formulir.
Dalam tutorial ini, kita telah melihat strategi validasi utama serta kelebihan dan kekurangannya. Kita juga mempelajari cara menetapkan aturan validasi dan mengeluarkan pesan kesalahan menggunakan pustaka validasi bawaan CodeIgniter. Kami mengakhiri pelajaran dengan menerapkan pengetahuan yang diperoleh dalam aplikasi praktis.

Anda mungkin ingin:

Formulir di CodeIgniter

Struktur Formulir HTML

Pembantu Formulir CodeIgniter

Contoh Formulir CodeIgniter

ARTIKEL TERKAIT

Buat Kontak

Validasi Formulir di CodeIgniter

Menambahkan Aturan Validasi Formulir

Validasi Unik

Menampilkan Pesan Kesalahan Validasi Formulir

Mengisi Data Formulir yang Dikirim: Formulir Lengket

Contoh Validasi Formulir CodeIgniter

Kesimpulan