Estoy realizando una validación en cliente de los campos de un formulario. A la hora de realizar la validación en JavaScript, tengo problemas con setCustomValidity, ya que si le doy a inspeccionar en la página me salta el error descrito en el título: Uncaught TypeError: longitud.setCustomValidity is not a function. El código de la función es el siguiente.
function longitudValidation(){
var longitud = document.getElementById("longitudVarilla");
var l = longitud.value;
if(l < 0 || l > 2000){
var error = "La longitud de la varilla debe ser un número comprendido entre 0 y 2000";
} else if(l == ""){
var error = "Por favor, introduzca la longitud de la varilla";
} else {
var error = "";
}
longitud.setCustomValidity(error);
return error;
}
El campo longitud está definido en el formulario por la etiqueta select, y es de tipo numérico, no sé si eso puede estar dando problemas. A la hora de utilizar la función para validar, utilizo el atributo onchange. Además, en la etiqueta form, utilizo el atributo onsubmit. Adjunto además el código de esas 2 etiquetas.
<form id="añadirVarilla" method="get" action="validacion_alta_varilla.php" onsubmit="return validateForm()">
<!--Aquí irían una serie de inputs y selects antes de la longitud -->
<label id="longitudVarilla">Longitud(en milímetros): </label>
<input id="longitudVarilla" type="number" name="longitudVarilla" max="2000" min="0" oninput="longitudValidation();" required/>
No sé cuál puede ser el problema. He pensado que el problema puede estar en que el setCustomValidity no sirve para campos numéricos, pero aparte de eso no tengo ni idea.