¿Puedo marcar un campo no válido desde javascript?

Al leer esta publicación , descubrí que hay algunas pseudoclases para valores de entrada 'válidos' e 'inválidos' introducidos en HTML5.

¿Hay alguna manera de marcar un campo de entrada como no válido / válido desde javascript? O alternativamente, ¿puedo anular el método de validación utilizado?

Puede utilizar la función customValidity para este propósito.

Si agrega un mensaje customValidity al campo, dejará de ser válido. Cuando configura el mensaje como una cadena vacía, vuelve a ser válido (a menos que no sea válido por otras razones).

field.setCustomValidity("Invalid field."); invalidará el campo.

field.setCustomValidity(""); hará que el campo sea válido a menos que falle una restricción HTML5.

Editar : Alguien aclaró que está buscando atributos "válidos" "no válidos" para DOM.

Agregaría atributos a cada etiqueta usando dom_object.setAttribute("isvalid", "true"). También podría tener una función de validación central que actualice estos atributos cada vez (y use dom_object.getAttribute("isvalid")cada vez).

Puede ejecutar esta función cada vez que un elemento pierde el foco o cuando lo desee.

No es exactamente elegante, pero desafortunadamente no hay soporte "pseudo" con javascript y HTML5 ahora.

Si entiendo su pregunta, puede realizar la validación con Javascript. Sin embargo, tenga en cuenta que es muy fácil eludir la validación del lado del cliente, especialmente la validación de JavaScript . Nunca debe confiar en los datos del cliente y siempre debe verificar en el lado del servidor.

Por ejemplo, podría encontrar fácilmente los ID de los elementos inspeccionando el código fuente y luego document.getElementById('some_id').setAttribute('max', new_number)cambiar el valor máximo (esta era una de las entradas de su enlace).

Hay varias formas de hacerlo, así que intentaré darles el modismo general.

Puede tomar el valor haciendo document.getElementById('form_element_id').value(asegúrese de dar el formulario a nameque se envía al servidor y idque es utilizado por JavaScript). Para áreas de texto, puede usar .innerHTML.

Entonces tienes el valor en una variable, hay varias formas de verificarlo.

Por ejemplo, podrías hacerlo if (parseInt(my_value) < 0) //error. También puede usar expresiones regulares, no lo explicaré todo, pero puede comenzar aquí http://www.w3schools.com/jsref/jsref_obj_regexp.asp . Sé que w3schools no es la mejor fuente, pero me parece un buen lugar para comenzar.

Ahora para la parte de validación: agregue onsubmit="return validateForm()a su etiqueta de formulario donde validateForm () es la función que hace toda la verificación. Y la función simplemente regresa truesi es válida y de lo falsecontrario. Esto anula la función de validación predeterminada (que por defecto no hace nada).

Entonces, en el ejemplo anterior, //errorsería reemplazado por return false. También puedes hacer otras cosas; como alertar el error y luego devolver falso. También puede usar javascript para resaltar los campos no válidos (no estoy seguro de si esto es lo que quiere decir con " marcar un campo de entrada como no válido / válido desde javascript ")

Por supuesto, si no desea marcar todos los campos, solo debe devolver verdadero si se aprueban determinados. Nuevamente, no debe confiar en esto, pero si solo desea disuadir a la gente promedio, entonces es una solución fácil.

¿Hay alguna manera de marcar un campo de entrada como no válido / válido desde javascript?

Desafortunadamente, no puede diseñar pseudoclases en JavaScript, ya que no son elementos reales, no existen en el DOM real.

Con JavaScript vanilla, usaría la API de validación .

En jQuery, simplemente puede hacer esto, http://jsfiddle.net/elclanrs/Kak6S/

if ( $input.is(':invalid') ) { ... }

O alternativamente, ¿puedo anular el método de validación utilizado?

Si está utilizando la validación HTML5, apéguese al marcado. De lo contrario, puede deshabilitar la validación de HTML5 con $form.attr('novalidate', 'novalidate')JS y usar JS para validar sus campos y luego agregar valido invalidclases donde sea necesario. Hice un complemento que funciona así para admitir navegadores que no son HTML5.