Why do not you show me the custom error?

Question

Why do not you show me the custom error?

Navigation

#1 by (1 votes)
#2 by (0 votes)
#3 by (0 votes)

1

I'm trying to run this custom error when typing but I do not get it

window.onload = function(){
	var cedula = document.getElementById('cedula');
	cedula.oninput = Numeros;
}

function Numeros(){
	var cedula = document.getElementByid('cedula');
	alert("");
	cedula.addEventListener('invalid', function(evt){
		if(this.validity.patternMismatch)
		{
			alert(this.validity.patternMismatch)
			this.setCustomValidity('solo numeros');
		}
	});
	cedula.addEventListener('input', function(evt){
		this.setCustomValidity('');
	});
}

<!DOCTYPE html>
<html lang = "es">
<head>
	<meta charset = "UTF-8">
	<title>Formulario de registro</title>
	<link rel="stylesheet" href="../css/reg.css">
	<script src = "../js/jquery-3.2.1.min.js"></script>
	<script src = "../js/validar1.js"></script>
</head>
<body>
	<h1>Formulario de registro</h1>
	<form  method= "post" class = "form-registro">
		<h2> Crear capitanes</h2>
		<div class ="contenedor-input">
			<input type = "text" pattern = "[0-9]" id = "cedula" name = "cedula" placeholder = "Cedula" class = "input-100" required>
			<input type = "button" value = " Registrar capitan" class = "btn-enviar" id = "btn-enviar">
		</div>		
	</form>
</body>
</html>

I really do not know what I'm doing wrong, I appreciate your help.

javascript html5 html

asked by Familia Valencia Hdz 01.01.2018 в 04:23

source

3 answers

0

You have not thought about doing something easier like this little validation with jquery:

$("#button").submit(function () {  
    if($("cedula").val().length < 1) {  
        alert("solo numeros");  
        return false;  
    }  
    return false;  
});

answered by 01.01.2018 в 04:54

0

If I did not understand correctly, what you want to do is validate that only numbers are those that are entered into the text when writing, I would do so, I hope and it will serve you: Note: to validate that a field is only numeric and at the same time format it, look for the plugin of jquery number format, and so it is no longer necessary to show that message of "only numbers"

$('#cedula').keyup(function(){
   var cedula = $(this).val();
   //lo que quieres que haga aquí
   console.log(cedula);//en la consola te irá imprimiendo lo que vayas escribiendo
});

answered by 01.01.2018 в 05:00

Error 1415 in MySQl when creating a trigger Problem with the Android Studio emulator

score 1 · Accepted Answer

You have the following errors:

In line cedula.oninput = Numeros; what you are doing is assign to the event input a function that, if you review it, subscribe more events. That is to say that each time you enter values at input , you add more and more listeners on the input , which will eventually cause that "hang" the browser.

For the error messages to appear, you need "Enviar" ( eg: submit ) of the form. That is to say that your <input type="button" , in fact it should be <input type = "submit" .

Solution:

window.onload = function() {
  var cedula = document.getElementById('cedula');
  cedula.oninput = Numeros;
}

function Numeros() {
  if (this.validity.patternMismatch) {
    this.setCustomValidity('solo numeros');
  } else {
    this.setCustomValidity('');
  }
}

<h1>Formulario de registro</h1>
<form method="post" class="form-registro">
  <h2> Crear capitanes</h2>
  <div class="contenedor-input">
    <input type="text" pattern="[0-9]" id="cedula" name="cedula" placeholder="Cedula" class="input-100" required>
    <input type="submit" value=" Registrar capitan" class="btn-enviar" id="btn-enviar">
  </div>
</form>