¿Puede desencadenar errores de formulario HTML5 personalizados con JavaScript?

Si tengo una entrada como <input type="text"> y quiero activar un error nativo en la entrada, ¿puedes hacer eso? Al igual (código de imitación) ele.triggerError('Error Message');¿Puede desencadenar errores de formulario HTML5 personalizados con JavaScript?

Sería el siguiente aspecto:

error http://tylergaw.com/storage/post_image_htmlFormErrors_defaultChrome.jpg

Pero con un mensaje personalizado y para su propia función de validación. Necesario para validaciones AJAX, por ejemplo.

Fuente

2011-12-21 Oscar Godson

Puede trabajar con JQuery, JQuery Validation lo hará por usted –

Quiero desencadenar errores nativos. Puedo escribir un error personalizado sin problema, pero quiero que todos coincidan con el navegador y utilicen HTML5. –

Dependiendo de las características de HTML5, es algo limitante ya que el soporte es desigual e inconsistente en todos los navegadores. HTML5 no es (y probablemente nunca lo será) un estándar, ni se detiene porque es una "especificación de vida". Es una combinación de estándares (es decir, [estándares W3C] (http://www.w3.org/standards/)), comportamiento heredado (es decir [DOM 0] (http://www.w3.org/TR/2000/) WD-DOM-Level-1-20000929/glossary.html # dt-DOM-Level-0)), comportamiento actual y características futuras propuestas, pero no identifica cuál es cuál. Por lo tanto, cualquier cosa que use HTML5 debe usar la detección de características con una reserva para el comportamiento básico del navegador. – RobG

La única manera de desencadenar el error nativo es enviar el formulario. Aunque puede establecer un mensaje personalizado con setCustomValidity (as described in my answer here) y puede desencadenar el evento invalid con checkValidity, esto solo proporciona ganchos para que pueda crear su propia IU de validación. Here's a simple example puede jugar con para verificar.

Tenga en cuenta que si envía el formulario con el método submit() que omitirá la API de validación. Pero si tiene el botón trigger the click event of the submit que funcionará en Firefox y Opera, pero no en Chrome. Evitaría hacerlo ahora mismo.

Fuente

2011-12-21 23:43:28 robertc

Hmm, he modificado el mensaje de error que tiene y que no se está mostrando en FF o Chrome. Hice "' blanksssss' "y todavía muestra' blank'. –

No importa ... ugh, JSFiddle. Olvidé que JSFiddle no se actualiza automáticamente como JSBin. Creo que esto está funcionando ... ¡Jugaré con eso un poco más! muchas gracias –

@OscarGodson Recuerde que puede verificar el objeto ['ValidityState'] (http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms. html # validitystate) para calcular * por qué * el campo no es válido. – robertc

Ahora puede usar el método HTMLFormElement.reportValidity(), actualmente está implementado en los navegadores Chrome, Firefox, Opera y Android, pero aún no en Internet Explorer o Safari (marque caniuse.com para ver el navegador compatible).

Fuente

2017-11-05 06:22:24

¿Puede desencadenar errores de formulario HTML5 personalizados con JavaScript?

Respuesta

Cuestiones relacionadas