Validation du formulaire CodeIgniter avec exemple de soumission de formulaire
Fiona Brun
Formulaire dans CodeIgniter
Les formulaires permettent aux utilisateurs d'interagir avec l'application et de soumettre des données. Il peut être utilisé pour un formulaire de contact qu'un visiteur du site Web peut remplir et nous envoyer les informations. Les informations reçues sont généralement stockées dans la base de données ou envoyées par e-mail.
Structure du formulaire HTML
Le code suivant montre la structure d'un formulaire HTML typique.
<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>
ICI,
- … sont les balises d'ouverture et de fermeture du formulaire. Les attributs id et name spécifient le nom et l'identifiant du formulaire. L'attribut méthode spécifie le verbe HTTP à utiliser. Ceci est généralement spécifié par le verbe POST
- Spécifie les éléments du formulaire. L'attribut name est le nom de la variable qui est soumis au serveur principal pour traitement.
Assistant de formulaire CodeIgniter
Le HTML est génial, il est facile à comprendre et à écrire, mais CodeIgniter rend les choses encore plus simples. CodeIgniter possède des fonctions intégrées pour créer des formulaires HTML.
Considérons le code de soumission de formulaire CodeIgniter suivant qui utilise l'assistant de formulaire pour créer un formulaire
<?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();
?>
ICI,
- echo form_open('create_user.php', ['id' => 'frmUsers']); crée la balise d'ouverture du formulaire, définit l'action sur POST Verb et définit l'URL de l'action sur create_user.php
- echo form_label('ID utilisateur', 'id_utilisateur'); crée une étiquette qui lit l'ID utilisateur pour le champ de saisie avec le nom user_id.
- echo form_input(['name' => 'user_id']); crée un champ de saisie de type texte avec le nom user_id
- echo form_submit('btnSubmit', 'Créer un utilisateur'); crée un bouton de soumission avec le libellé Créer un utilisateur
- echo form_close(); ferme le formulaire
Comme vous pouvez le voir dans le code CodeIgniter ci-dessus, les assistants de formulaire nous permettent de créer facilement des formulaires en utilisant du PHP pur. En transmettant des attributs aux méthodes d'assistance du formulaire, nous pouvons personnaliser le code HTML généré pour le formulaire.
Le code ci-dessus génère le code de formulaire HTML suivant
<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>
Le plus grand avantage de l’utilisation de l’assistant de formulaire est qu’il génère un code sémantiquement correct qui adhère aux normes HTML définies.
Vous pouvez vous référer à la documentation officielle de CodeIgniter pour plus de détails
https://codeigniter.com/user_guide/helpers/form_helper.html
Exemple de formulaire CodeIgniter
Après avoir couvert les bases de CodeIgniter, revenons à notre projet de tutoriel sur lequel nous avons travaillé tout au long de cette Série de didacticiels CodeIgniter. En résumé, le projet du didacticiel crée une application de gestion de contacts qui stockera les détails dans la base de données.
Créer un contact
dans le didacticiel précédent, nous avons créé des itinéraires pour nos applications et des vues simples. Ouvrez application/views/contacts/create.php
Modifiez le code de create.php comme suit
<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>
Remarque: le code ci-dessus utilise du HTML brut pour créer des formulaires.
Voyons maintenant à quoi ressemblent nos formulaires dans le navigateur Web
Chargez l'URL suivante dans notre navigateur Web.
http://localhost:3000/contacts/create
Si vous avez créé le projet de didacticiel, vous devriez pouvoir voir ce qui suit
Validation de formulaire dans CodeIgniter
La validation joue un rôle très critique lors du traitement des données des formulaires. Disons qu'un utilisateur s'inscrit sur un site Web ; nous voulons nous assurer qu'ils remplissent les informations et l'adresse e-mail requises. Nous devons nous assurer que l'adresse e-mail saisie est valide. Si nous travaillons avec des valeurs de date, nous voulons nous assurer que les plages de dates sont valides. Nous n'aurions pas à accepter une date comportant 32 jours dans un mois, etc.
La validation résout les problèmes ci-dessus. La validation CodeIgniter s'effectue sur deux (2) fronts lorsque vous travaillez avec des applications Web.
La validation côté client est effectuée du côté du navigateur Web. Cela implique généralement l'utilisation de HTML et JavaScript. La validation côté client améliore les performances car tout est effectué côté client. Il n'est donc pas nécessaire de soumettre les données au serveur. L'inconvénient de la validation côté client est que l'utilisateur en a le contrôle. Si vous comptez sur JavaScript à valider et l'utilisateur désactive JavaScript dans le navigateur, votre validation échouera alors.
La validation côté serveur est effectuée côté serveur. L'inconvénient de cette validation est que l'utilisateur doit soumettre les données au serveur pour traitement et attendre la réponse. Cela utilise les ressources du réseau et peut dégrader les performances. Le principal avantage de la validation côté serveur est que vous avez un meilleur contrôle et que vous êtes assuré que vos règles de validation fonctionnent même si l'utilisateur désactive JavaScript dans le navigateur.
Une meilleure stratégie consiste à utiliser le côté client comme stratégie de validation principale et le côté serveur comme mécanisme de secours.
Ajout de règles de validation de formulaire
CodeIgniter dispose d'une bibliothèque de validation intégrée. La bibliothèque est chargée à l'aide de la ligne suivante
$this->load->library('form_validation');
La bibliothèque de validation de formulaire CodeIgniter peut être utilisée pour effectuer certaines des actions suivantes
- Vérifiez les champs obligatoires. Ceci examine les valeurs soumises et renvoie une erreur si un champ qui a été marqué comme requis n'a pas de valeur.
- Validation du type de données – certains champs peuvent nécessiter uniquement des valeurs numériques. Si une valeur non numérique est détectée, la bibliothèque renvoie une erreur. L'exécution de la soumission du formulaire est également interrompue.
- Validation de la longueur – certains types de données nécessitent que les champs comportent un certain nombre minimum ou maximum de caractères. La bibliothèque de validation est utile dans de tels cas.
- Désinfection des données – la bibliothèque de validation dispose également de fonctionnalités qui suppriment le code malveillant des données soumises pour des raisons de sécurité. Si par exemple les valeurs soumises ont une valeur active JavaScript ou code d'injection SQL, la bibliothèque de validation supprime le code nuisible et le rend inutile.
- Validez les champs de base de données uniques – supposons que vous disposiez d'un formulaire dans lequel les utilisateurs s'inscrivent en utilisant une adresse e-mail. Vous voudriez vous assurer que l’adresse e-mail est unique. La bibliothèque vous permet de vérifier facilement les données soumises par rapport à une table et un champ de base de données. Cela permet de savoir que la valeur a déjà été prélevée.
Les règles de validation sont définies en utilisant le format suivant
$this->form_validation->set_rules('field','human readable field','rule',['custom message']);
ICI,
- 'field' spécifie le nom du champ du formulaire à valider par la bibliothèque
- « champ lisible par l'homme » spécifie le format lisible par l'homme du champ en cours de validation. Ceci est affiché à l'utilisateur lorsqu'une erreur se produit.
- 'rule' spécifie la règle de validation à appliquer, telle que obligatoire, numérique, vérifier si la longueur minimale est… etc.
- ['custom message'] est facultatif et peut être utilisé pour définir un message de validation personnalisé qui doit être affiché lorsque la règle de validation échoue.
Voici un formulaire soumis dans l'exemple CodeIgniter pour valider le nom du contact
$this->form_validation->set_rules('contact_number', 'Contact Number', 'required');
ICI,
- Le code ci-dessus vérifie si le champ contact_number a été renseigné. S'il n'est pas défini, renvoie une erreur indiquant que le champ Numéro de contact est requis.
Pour exécuter la validation par rapport aux règles définies, nous utilisons la fonction suivante de la bibliothèque de validation
$this->form_validation->run()
Si le code ci-dessus renvoie false, cela signifie qu'une ou plusieurs règles définies ont échoué. Si le résultat est vrai, cela signifie que les règles de validation ont toutes été respectées et que vous pouvez poursuivre l'action.
Examinons d'autres exemples de règles de validation. Supposons que vous souhaitiez valider certains champs indiquant le nom, le numéro et l'adresse e-mail du contact, vous pouvez utiliser le code suivant pour y parvenir.
$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);
ICI,
- Dans l'exemple de validation d'e-mail ci-dessus dans CodeIgniter, nous fournissons un tableau de champs avec des règles pour la fonction set_rules de la bibliothèque. Cela facilite la tâche lorsque vous validez certains champs.
Validation unique
Si nous voulons valider le numéro de contact pour nous assurer que nous n'enregistrons pas deux fois le même numéro, nous pouvons utiliser la règle suivante pour ce faire.
$this->form_validation->set_rules('contact_number', 'Contact Number','required|is_unique[contacts.contact_number]');
ICI,
- | est utilisé pour regrouper plusieurs règles ensemble
- is_unique[contacts.contact_number] vérifie si la valeur de contact_number est unique par rapport aux valeurs du champ contact_number dans la table de base de données contacts.
Affichage des messages d'erreur de validation de formulaire
Si une erreur survient lors du traitement du formulaire, vous pouvez utiliser le code suivant pour afficher les erreurs de validation survenues
<?php echo validation_errors(); ?>
ICI,
- La fonction ci-dessus renvoie toutes les erreurs survenues.
Remplir les données du formulaire soumis : formulaires collants
Certains formulaires comportent de nombreux champs et si une erreur s'est produite, vous devez vous assurer que les données correctement ajoutées sont conservées. La bibliothèque de validation dispose de mécanismes pour y parvenir. Nous faisons cela en utilisant le code suivant.
<?php echo set_value('field_name'); ?>
ICI,
- Le code ci-dessus affiche l'entrée que l'utilisateur a saisie.
Pour un guide de référence complet sur les méthodes disponibles dans la bibliothèque de validation, vous pouvez vous référer à la documentation de l'API dans le guide de l'utilisateur officiel de CodeIgniter.
https://codeigniter.com/userguide3/libraries/form_validation.html
Exemple de validation de formulaire CodeIgniter
Tout au long de cette série de didacticiels, nous avons ajouté davantage de code à notre projet de didacticiel qui est une application de gestion de contacts. Dans cette section, nous allons charger la bibliothèque de validation et voir comment nous pouvons la mettre en pratique à l'aide d'un exemple d'application réel.
Modifiez le code des routes comme suit pour inclure la méthode 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';
Chargeons maintenant la bibliothèque de validation de formulaire dans le contrôleur Contacts et définissons quelques règles de validation.
Modifiez le code comme indiqué dans la validation du formulaire ci-dessous dans l'exemple 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');
}
}
ICI,
- $rules = array(…) sets définit les règles de validation
- $this->form_validation->set_rules($rules); définit les règles de validation
- if ($this->form_validation->run() == FALSE) {…} exécute les règles de validation et si elles échouent, le formulaire est réaffiché avec des erreurs de validation. Si la validation réussit, nous redirigeons simplement vers la page de la liste des contacts. Dans des circonstances normales, nous écrivions les données dans la base de données. Nous le ferons dans les prochains tutoriels lorsque nous examinerons bases de données.
Modifiez la vue de création dans le code application/contacts/create.php comme indiqué dans l'exemple CodeIgniter de validation de formulaire ci-dessous :
<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>
ICI,
- nous affichons les erreurs qui surviennent le cas échéant pendant le processus de validation
- définit la valeur qui a été précédemment définie, le cas échéant
Vous devez charger l'URL suivante dans votre navigateur Web. Cliquez ensuite sur Créer un contact sans saisir aucune valeur
Résumé
- Les formulaires permettent aux utilisateurs d'interagir avec l'application et de soumettre des données.
- Le HTML est génial, il est facile à comprendre et à écrire, mais CodeIgniter rend les choses encore plus simples. CodeIgniter possède des fonctions intégrées pour créer des formulaires HTML.
- La validation joue un rôle très critique lors du traitement des données des formulaires.
- Dans ce didacticiel, nous avons vu les principales stratégies de validation ainsi que leurs avantages et inconvénients. Nous avons également appris à définir des règles de validation et à afficher des messages d'erreur à l'aide de la bibliothèque de validation intégrée de CodeIgniter. Nous avons terminé la leçon en mettant en œuvre les connaissances acquises dans une application pratique.