web-dev-qa-db-fra.com

Modèle de validation de formulaire HTML5 alphanumérique avec des espaces?

J'ai la balise d'entrée suivante dans mon formulaire html5:

<p>
    <label>Company Name*</label>
    <input type="text" name="name" class="field" required pattern="[a-zA-Z0-9]+" />
</p>

Cela fonctionne correctement en vérifiant si le nom de la société est composé de caractères alphanumériques. Mais bien sûr, je souhaite autoriser des espaces dans le nom de la société. J'ai besoin de savoir ce que je devrais ajouter au motif.

regexhtml5validationhtml-formalphanumeric
37
RTB

Pourquoi ne pas ajouter un espace dans l'attribut de motif tel que pattern="[a-zA-Z0-9 ]+". Si vous souhaitez prendre en charge tout type d'espace, essayez pattern="[a-zA-Z0-9\s]+"

67
Lachezar

Ma solution est de couvrir toute la gamme des signes diacritiques:

([A-z0-9À-ž\s]){2,}

A-z - pour tous les caractères latins

0-9 - pour tous les chiffres

À-ž - pour tous les signes diacritiques

\s - c'est pour les espaces

{2,} - la chaîne doit comporter au moins 2 caractères

17
bumerang

Pour éviter une entrée avec uniquement des espaces, utilisez: "[a-zA-Z0-9]+[a-zA-Z0-9 ]+".

eg: abc | abc aBc | abc 123 AbC 938234

Pour vous assurer, par exemple, que le premier nom de famille ET est entré, utilisez une légère variation telle que 

"[a-zA-Z]+[ ][a-zA-Z]+"

eg: abc def
7
whitepolkydots

C'est une question assez ancienne, mais au cas où cela pourrait être utile pour n'importe qui, en partant d'une combinaison de bonnes réponses trouvées ici, j'ai fini par utiliser ce modèle:

pattern="([^\s][A-z0-9À-ž\s]+)"

Cela nécessitera au moins deux caractères, en veillant à ne pas commencer par un espace vide, mais en laissant des espaces entre les mots, ainsi que des caractères spéciaux tels que ą, ó, ä, ö.

3
MYbuddy

Utilisez ce code pour vous assurer que l'utilisateur n'entre pas seulement des espaces mais un nom valide:

pattern="[a-zA-Z][a-zA-Z0-9\s]*"
3
ab_wanyama

Utilisez comme ci-dessous le code de format

$('#title').keypress(function(event){
    //get envent value       
    var inputValue = event.which;
    // check whitespaces only.
    if(inputValue == 32){
        return true;    
    }
     // check number only.
    if(inputValue == 48 || inputValue == 49 || inputValue == 50 || inputValue == 51 || inputValue == 52 || inputValue == 53 ||  inputValue ==  54 ||  inputValue == 55 || inputValue == 56 || inputValue == 57){
        return true;
    }
    // check special char.
    if(!(inputValue >= 65 && inputValue <= 120) && (inputValue != 32 && inputValue != 0)) { 
        event.preventDefault(); 
    }
})
0
Selvamani P