Перевірка форми CodeIgniter із прикладом надсилання форми
Фіона Браун
Форма в CodeIgniter
Форми надають можливість користувачам взаємодіяти з програмою та надсилати дані. Його можна використовувати для форми зв’язку, яку відвідувач веб-сайту може заповнити та надіслати нам інформацію. Отримана інформація зазвичай зберігається в базі даних або надсилається електронною поштою.
Структура форми HTML
Наступний код показує структуру типової форми HTML.
<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>
ТУТ,
- … відкривають і закривають теги форми. Атрибут id і name визначає назву та id форми. Атрибут методу визначає дієслово HTTP, яке буде використано. Зазвичай це вказується дієсловом POST
- Визначає елементи форми. Атрибут name — це ім’я змінної, яке надсилається на сервер для обробки.
Помічник форм CodeIgniter
HTML чудовий, його легко зрозуміти та написати, але CodeIgniter робить речі ще простішими. CodeIgniter має вбудовані функції для створення HTML-форм.
Давайте розглянемо наступний код надсилання форми CodeIgniter, який використовує помічник форми для створення форми
<?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();
?>
ТУТ,
- echo form_open('create_user.php', ['id' => 'frmUsers']); створює початковий тег форми, встановлює дієслово POST і встановлює URL-адресу дії create_user.php
- echo form_label('Ідентифікатор користувача', 'ідентифікатор_користувача'); створює мітку з ідентифікатором користувача для поля введення з іменем user_id.
- echo form_input(['name' => 'user_id']); створює поле введення текстового типу з іменем user_id
- echo form_submit('btnSubmit', 'Створити користувача'); створює кнопку надсилання з міткою Створити користувача
- echo form_close(); закриває форму
Як ви можете бачити з наведеного вище коду CodeIgniter, помічники форм полегшують нам створення форм за допомогою чистого PHP. Передаючи атрибути допоміжним методам форми, ми можемо налаштувати HTML, який створюється для форми.
Наведений вище код створює наступний код форми HTML
<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>
Найбільшими перевагами використання помічника форм є те, що він генерує семантично правильний код, який відповідає встановленим стандартам HTML.
Ви можете звернутися до офіційної документації CodeIgniter для отримання додаткової інформації
https://codeigniter.com/user_guide/helpers/form_helper.html
Приклад форми CodeIgniter
Розглянувши основи CodeIgniter, давайте повернемося до нашого навчального проекту, над яким ми працювали протягом цього Серія навчальних посібників CodeIgniter. Підсумовуючи, навчальний проект створює додаток для керування контактами, який зберігатиме деталі в базі даних.
Створити контакт
у попередньому посібнику ми створили маршрути для наших програм і простих представлень. Відкрийте програму/views/contacts/create.php
Змініть код для create.php таким чином
<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>
Примітка: наведений вище код використовує звичайний HTML для створення форм.
Давайте подивимося, як наші форми виглядають у веб-браузері
Завантажте наступну URL-адресу в наш веб-переглядач.
http://localhost:3000/contacts/create
Якщо ви створювали навчальний проект, ви повинні побачити наступне
Перевірка форми в CodeIgniter
Перевірка відіграє дуже важливу роль під час обробки даних із форм. Скажімо, користувач реєструється на веб-сайті; ми хочемо переконатися, що вони заповнюють необхідні дані та адресу електронної пошти. Ми повинні переконатися, що введена електронна адреса дійсна. Якщо ми працюємо зі значеннями дат, ми хочемо переконатися, що діапазони дат дійсні. Нам не потрібно приймати дату, яка має 32 дні в місяці тощо.
Перевірка вирішує вищевказані проблеми. Під час роботи з веб-додатками перевірка CodeIgniter виконується з двох (2) сторін.
Перевірка на стороні клієнта виконується веб-браузером. Зазвичай це передбачає використання HTML і JavaСценарій. Перевірка на стороні клієнта покращує продуктивність, оскільки все виконується на стороні клієнта. Таким чином, немає необхідності надсилати дані на сервер. Недоліком перевірки на стороні клієнта є те, що користувач може контролювати її. Якщо ви покладаєтеся на JavaСценарій для перевірки та відключення користувача JavaСценарій у веб-переглядачі, тоді ваша перевірка не вдасться.
Перевірка на стороні сервера виконується на стороні сервера. Недоліком цієї перевірки є те, що користувач повинен надіслати дані на сервер для обробки та чекати відповіді. Це споживає ресурси мережі та може погіршити продуктивність. Основна перевага перевірки на стороні сервера полягає в тому, що ви маєте більший контроль і можете бути впевнені, що ваші правила перевірки працюють, навіть якщо користувач вимикає JavaСкрипт в браузері.
Кращою стратегією є використання сторони клієнта як основної стратегії перевірки та сторони сервера як резервного механізму.
Додавання правил перевірки форми
CodeIgniter має вбудовану бібліотеку перевірки. Бібліотека завантажується за допомогою наступного рядка
$this->load->library('form_validation');
Бібліотеку перевірки форм CodeIgniter можна використовувати для виконання деяких із наведених нижче дій
- Перевірте наявність обов'язкових полів. Це перевіряє надіслані значення та повертає помилку, якщо поле, позначене як обов’язкове, не має значення
- Перевірка типу даних – для деяких полів можуть знадобитися лише числові значення. Якщо виявлено нечислове значення, то бібліотека повертає помилку. Виконання надсилання форми також переривається.
- Перевірка довжини – деякі типи даних вимагають, щоб поля мали певну мінімальну або максимальну кількість символів. Бібліотека перевірки стане в нагоді в таких випадках.
- Очищення даних – бібліотека перевірки також має можливості, які видаляють шкідливий код із надісланих даних з міркувань безпеки. Якщо, наприклад, подані значення активні JavaБібліотека перевірки видаляє шкідливий код і робить його марним.
- Перевірте унікальні поля бази даних – припустімо, у вас є форма, де користувачі реєструються за допомогою адреси електронної пошти. Вам потрібно переконатися, що адреса електронної пошти є унікальною. Бібліотека полегшує перевірку надісланих даних у таблиці та полях бази даних. Це дозволяє вам знати, що значення вже використано.
Правила перевірки встановлюються за допомогою наступного формату
$this->form_validation->set_rules('field','human readable field','rule',['custom message']);
ТУТ,
- 'field' вказує ім'я поля форми, яке має бути перевірено бібліотекою
- 'людиночитане поле' вказує зрозумілий людині формат поля, що перевіряється. Це відображається назад для користувача, коли виникає помилка.
- 'правило' визначає правило перевірки, яке буде застосовано, наприклад обов'язкове, числове, перевірка мінімальної довжини... тощо.
- ['спеціальне повідомлення'] є необов'язковим і може використовуватися для встановлення спеціального повідомлення перевірки, яке має відображатися, коли правило перевірки не виконується.
Нижче наведено приклад форми, надісланої в CodeIgniter для підтвердження імені контакту
$this->form_validation->set_rules('contact_number', 'Contact Number', 'required');
ТУТ,
- Наведений вище код перевіряє, чи було введено поле contact_number. Якщо його не встановлено, повертається помилка про те, що поле контактного номера є обов’язковим.
Щоб виконати перевірку за встановленими правилами, ми використовуємо наступну функцію бібліотеки перевірки
$this->form_validation->run()
Якщо наведений вище код повертає false, це означає, що одне або кілька налаштованих правил не виконано. Якщо він повертає true, це означає, що всі правила перевірки виконано, і ви можете продовжити подальші дії.
Давайте розглянемо більше прикладів правил перевірки. Припустімо, що ви хочете перевірити деякі поля, які містять ім’я, номер і адресу електронної пошти контактної особи, для цього можна використати наступний код.
$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);
ТУТ,
- У наведеному вище прикладі перевірки електронної пошти в CodeIgniter ми надаємо масив полів із правилами для функції set_rules бібліотеки. Це полегшує перевірку деяких полів.
Унікальна перевірка
Якщо ми хочемо підтвердити контактний номер, щоб переконатися, що ми не зберігаємо один і той самий номер двічі, ми можемо використовувати для цього наступне правило.
$this->form_validation->set_rules('contact_number', 'Contact Number','required|is_unique[contacts.contact_number]');
ТУТ,
- | використовується для об’єднання кількох правил
- is_unique[contacts.contact_number] перевіряє, чи унікальне значення для contact_number порівняно зі значеннями поля contact_number у таблиці contacts бази даних.
Відображення повідомлень про помилки перевірки форми
Якщо під час обробки форми сталася помилка, ви можете використати наступний код, щоб відобразити помилки перевірки, які виникли
<?php echo validation_errors(); ?>
ТУТ,
- Наведена вище функція повертає всі помилки, які виникли.
Заповнення надісланих даних форми: закріплені форми
Деякі форми мають багато полів, і якщо сталася помилка, ви хочете переконатися, що правильно додані дані збережено. Бібліотека перевірки має механізми для цього. Ми робимо це за допомогою наступного коду.
<?php echo set_value('field_name'); ?>
ТУТ,
- Наведений вище код відображає те введення, яке ввів користувач.
Щоб отримати повний довідковий посібник щодо методів, доступних у бібліотеці перевірки, ви можете звернутися до документації API з офіційного посібника користувача для CodeIgniter
https://codeigniter.com/userguide3/libraries/form_validation.html
Приклад перевірки форми CodeIgniter
Протягом цієї серії посібників ми додавали більше коду до нашого навчального проекту, який є програмою для керування контактами. У цьому розділі ми завантажимо бібліотеку перевірки та побачимо, як ми можемо застосувати її на практиці за допомогою реального прикладу програми.
Змініть код маршрутів таким чином, щоб включити метод store
$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';
Давайте тепер завантажимо бібліотеку перевірки форм у контролер контактів і встановимо деякі правила перевірки.
Змініть код, як показано у наведеній нижче формі перевірки у прикладі 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');
}
}
ТУТ,
- $rules = array(…) sets визначає правила перевірки
- $this->form_validation->set_rules($rules); встановлює правила перевірки
- if ($this->form_validation->run() == FALSE) {…} запускає правила перевірки, і якщо вони не виконуються, форма повторно відображається з помилками перевірки. Якщо перевірку пройдено, ми просто переспрямуємо на сторінку списку контактів. За звичайних обставин ми записували б дані в базу даних. Ми зробимо це в наступних уроках, коли подивимось базами даних.
Змініть вигляд створення в коді application/contacts/create.php, як показано в наведеному нижче прикладі перевірки форми CodeIgniter:
<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>
ТУТ,
- ми відображаємо помилки, які виникають під час процесу перевірки
- встановлює значення, яке було встановлено раніше, якщо таке було
Вам потрібно завантажити наступну URL-адресу у веб-браузер. Потім натисніть «Створити контакт», не вводячи жодних значень
Підсумки
- Форми надають можливість користувачам взаємодіяти з програмою та надсилати дані.
- HTML чудовий, його легко зрозуміти та написати, але CodeIgniter робить усе ще простішим. CodeIgniter має вбудовані функції для створення HTML-форм.
- Перевірка відіграє дуже важливу роль під час обробки даних із форм.
- У цьому підручнику ми побачили основні стратегії перевірки та їхні плюси та мінуси. Ми також навчилися встановлювати правила перевірки та виводити повідомлення про помилки за допомогою вбудованої бібліотеки перевірки CodeIgniter. Завершили урок реалізацією отриманих знань на практиці.
