Zebra_Form - Une librairie en PHP/JQuery pour créer des formulaires

Zebra_Form est une librairie alliant PHP et JQuery pour simplifier la création, la validation et l'ergonomie de vos formulaires.

Vous vous souvenez peut-être de Zebra_Image, une librairie PHP très utile pour manipuler vos images, le même auteur Stefan Gabos récidive avec Zebra_Form:

Cette librairie est une bonne alternative aux personnes qui n'utilisent pas de framework PHP, voici un résumé des fonctionnalités:

• Déclaration simplifiée de chaque élément du formulaire, et génération du formulaire via l'appel d'une méthode
• Validation côté client du formulaire (bulles d'infos, alias Tooltip qui apparaissent si un champ est incorrect)
• Validation côté serveur via l'appel d'une méthode
• Tokens anti-bot

Bref, que des bonnes choses !

Installation:

Dans vos fichiers HTML, vous incluez le style du formulaire, JQuery et le fichier JS:

<!-- Fichier CSS du formulaire -->
<link rel="stylesheet" href="path/to/zebra_form.css">

<!-- Librairie JQuery-->
<script src="path/to/jquery.js"></script>

<!-- Plugin JQuery de Zebra_Form -->
<script src="path/to/zebra_form.js"></script>

Utilisation:

Côté fonctionnel, il est très similaire à la logique des formulaires des Frameworks, avec la validation JS côté client en plus.

Tout d'abord, il faut inclure la class PHP de Zebra_Form là où vous voulez l'utiliser (dans vos fichiers PHP) et déclarer un objet:

require 'path/to/Zebra_Form.php';
$form = new Zebra_Form('form');

Ensuite, pour ajouter un champ email par exemple, il va falloir utiliser les méthodes de l'objet:

// Ajout du label de l'email
$form->add('label', 'label_email', 'email', 'Email');

// Ajout d'un input de type "text" qui a pour nom "email", et qui n'est pas auto-complété par le navigateur
$obj = $form->add('text', 'email', '', array('autocomplete' => 'off'));

// Ajout des règles de valdiation du champ "email"
$obj->set_rule(array(
    'required'  =>  array('error', 'Email is required!'),
    'email'     =  array('error', 'Email address seems to be invalid!'),

));

Il existe de nombreuses règles, comme le minimum de caractères requis, le maximum... référez-vous à la documentation !

On ajoute le bouton submit:

// bouton "submit"
$form->add('submit', 'btnsubmit', 'Envoyer');

La méthode magique pour générer l'HTML de votre formulaire en un clin d'oeil:

$form->render();

Et pour finir, la validation du formulaire lorsqu'il est envoyé (attention, vous devez redéclarer un objet ayant les mêmes champs et règles avant d'appeler cette méthode):

if ($form->validate()) {
    // Mon form est valide, j'en fais ce que je veux
}

Pratique n'est-ce pas ?

Enfin, vous n'avez plus qu'à customiser vos formulaires via le fichier CSS de la librairie.

Site Officiel