hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Valider les entrées de formulaire facilement sur n'importe quel navigateur avec Validatr

Traiter des formulaires sur le Web peut être très intéressant. Vous pouvez faire beaucoup de personnalisation dans la conception, sur l'étiquette et même sur l'authentification. Avec beaucoup de nouvelles fonctionnalités disponibles en HTML5, Jay Morrow a créé Validatr qui s'appuie sur les nouveaux attributs d'entrée HTML5 pour effectuer une validation de formulaire simple et automatique.

Validatr est un plugin jQuery gratuit pour tous les navigateurs. Il encapsulera automatiquement la bordure du formulaire en rouge si l'utilisateur entre une valeur non valide. Il peut également faire beaucoup de validation d'entrée comme le courrier électronique, le nombre, l'URL, la gamme, les entrées de couleur et la date .

Des messages d'erreur personnalisés sont également disponibles avec différents choix utilisant des attributs de données HTML5. Vous pouvez personnaliser l'élément de message d'erreur avec votre propre CSS, et le plugin a de très bons styles CSS.

Guide de base

Pour utiliser Validatr, ajoutez la dernière version de jQuery et le script Validatr dans votre projet.

Puis appelez le plugin avec l'extrait suivant:

Le plugin reconnaîtra l'élément de form pour appliquer les modifications.

Balisage HTML

Comme mentionné, Validatr utilise l'élément d' input pour fonctionner. L'élément est enveloppé dans l'étiquette de form . L'élément d' input gérera tous les types et paramètres de formulaire différents en utilisant data-attribute HTML5.

Par exemple, lorsque vous souhaitez créer un formulaire numérique, ajoutez simplement type="number" dans l' input et certaines exigences supplémentaires, par exemple la limitation du nombre min et max. Si les utilisateurs ne sont pas autorisés à laisser le formulaire vide, ajoutez simplement l'attribut required .

Voici un exemple d'implémentation de base:

L'attribut step est utilisé pour les incréments de valeur lorsque l'utilisateur clique sur la flèche d'augmentation ou de diminution dans le formulaire, en commençant par le nombre min défini ou 0. Si la valeur est définie sur "0", cela signifie qu'il utilise un incrément par défaut. point (la valeur doit être un nombre positif).

Et voici le résultat lorsqu'un utilisateur entre une valeur invalide ou un numéro hors plage. Notre exemple utilise 2 pour l' step qui signifie à partir de 1, les seuls nombres valides, ont un incrément de 2, c'est-à-dire: 3, 5, 7 et ainsi de suite. La valeur maximale est 11.

Pour une liste complète des autres types d'entrées et de la documentation des attributs, rendez-vous sur la page Validatr.

Photographie de jour de pluie: 35 exemples éblouissants

Photographie de jour de pluie: 35 exemples éblouissants

Beaucoup de photographes considèrent le mauvais temps comme l'une des pires choses pour prendre des photos de haute qualité à l'extérieur. À mon avis, il n'y a pas de mauvais ou de beau temps pour prendre des photos, car chaque temps a sa propre beauté. Le mauvais temps, en particulier le temps de pluie, est la meilleure période pour essayer et tirer quelques œuvres rares et belles dans votre portefeuille.Cela di

(Conseils techniques et de conception)

10 signes que vous êtes allé trop loin dans la conception Freelance

10 signes que vous êtes allé trop loin dans la conception Freelance

Le design freelance est génial, mais personne que je connais jusqu'à présent n'est resté comme il l'était auparavant après des années d'expérience freelance (souvent traumatisante). Après un moment, nous aimerions penser que petit à petit, nous avons évolué vers quelque chose au-delà de l'humain, avec des capacités surnaturelles ou des traits perturbateurs mentaux, et voici ce que je veux partager aujourd'hui: les 10 habitudes que vous développez quand vous tombez trop profondément dans la conception freelance .Parcourez la li

(Conseils techniques et de conception)