Estou fazendo um formulario e o usuario tem que digitar somente letras no campo do nome dele, eu quero bloquear para ele digitar algum outro tipo de caractere ah nao ser as letras, como faço? Estou programando com HTML5 e CSS 3. O formulario vai ser WEB.
-
1Você está fazendo isso em Web, Desktop em que linguagem? Edite sua pergunta para não ser negativado..– JcSaint15/07/2016 às 18:54
-
Que browsers queres suportar? Que liguagem estás a usar?– Sergio15/07/2016 às 18:54
-
Por favor não juntes partes de respostas para incluir na pergunta. Junta o código que tens mas sem modificar a pergunta com pedaços de respostas.– Sergio15/07/2016 às 19:19
2 Respostas
Olá, você pode utilizar o Jquery para efetuar isso ou utilizar o javascript sem ele.
Exemplo com jQuery, não precisa mecher no input
, apenas estar entre as tags <script></script>
$("#exemplo").on("input", function(){
var regexp = /[^a-zA-Z]/g;
if(this.value.match(regexp)){
$(this).val(this.value.replace(regexp,''));
}
});
Sem jQuery:
No input vai ter que utilizar um evento tipo:
<input id="exemplo" onkeypress="return lettersOnly(event);"/>
Função entre as tags <script></script>
no fim do código
function lettersOnly(evt) {
evt = (evt) ? evt : event;
var charCode = (evt.charCode) ? evt.charCode : ((evt.keyCode) ? evt.keyCode :
((evt.which) ? evt.which : 0));
if (charCode > 31 && (charCode < 65 || charCode > 90) &&
(charCode < 97 || charCode > 122)) {
alert("Enter letters only.");
return false;
}
return true;
}
-
-
1Eu testei aqui pra fazer com jquery irei enviar uma parte do meu codigo para voce ver... 15/07/2016 às 19:15
-
Confira ai e me ajude se possivel eu tenho que fazer o input text aceitar somente letras. 15/07/2016 às 19:16
-
-
Toma cuidado com o uso do patter pois de acordo com o w3schools ele não suporta alguns navegadores antigos nem no safari, e isto é um sério problema. 15/07/2016 às 19:26
Vou fazer um exemplo em javascript
puro.
Utilizando expressões regulares.
<form name="form_name" action="recebe_form.php" method="post">
Name:
<input id="input_nome" type="text" name="fname">
<input type="submit" value="Submit" onclick="valida_nome()">
</form>
<script>
function valida_nome() {
var filter_nome = /^([a-zA-Zà-úÀ-Ú]|\s+)+$/;
if (!filter_nome.test(document.getElementById("input_nome").value)) {
document.getElementById("input_nome").value = '';
document.getElementById("input_nome").placeholder = "Nome inválido";
document.getElementById("input_nome").style.borderColor = "#ff0000";
document.getElementById("input_nome").style.outline = "#ff0000";
document.getElementById("input_nome").focus();
document.getElementById("input_nome").onkeydown = function keydown_nome() {
document.getElementById("input_nome").placeholder = "";
document.getElementById("input_nome").style.borderColor = "#999999";
document.getElementById("input_nome").style.outline = null;
}
return false;
} else {
document.getElementById("input_nome").value = '';
document.getElementById("input_nome").placeholder = "Nome Válido";
}
return true;
}
</script>
Dessa forma esta aceitando letras,letras acentuadas e espaços.
É aconselhável realizar a validação no banco de dados também.
Segue um exemplo simples em php
.
recebe_form.php
<?php
$name = "";
if($_SERVER["REQUEST_METHOD"] == "POST"){
if(empty($_POST["nome_cad"])){
return false;
}else{
$nome = htmlspecialchars($_POST["input_nome"]);
if(!preg_match("/^([a-zA-Zà-úÀ-Ú]|\s+)+$/",$nome)){
return false;
}
}
?>