Posso contrassegnare un campo non valido da javascript?

Dalla lettura di questo post ho scoperto che esistono alcune pseudo classi per valori di input "validi" e "non validi" introdotti in HTML5.

C'è un modo per contrassegnare un campo di input come non valido / valido da javascript? O in alternativa, posso ignorare il metodo di convalida utilizzato?

È possibile utilizzare la funzione customValidity per questo scopo.

Se aggiungi un messaggio customValidity al campo, diventa non valido. Quando si imposta il messaggio come una stringa vuota, diventa nuovamente valido (a meno che non sia non valido per altri motivi).

field.setCustomValidity("Invalid field."); renderà il campo non valido.

field.setCustomValidity(""); renderà il campo valido a meno che non fallisca un vincolo HTML5.

Modifica : qualcuno ha chiarito che stai cercando attributi "validi" "non validi" per DOM.

Aggiungerei attributi a ogni tag utilizzando dom_object.setAttribute("isvalid", "true"). Potresti anche avere una funzione di convalida centrale che aggiorna questi attributi ogni volta (e usa dom_object.getAttribute("isvalid")ogni volta).

Puoi eseguire questa funzione ogni volta che un elemento perde il focus, o quando vuoi.

Non esattamente elegante, ma sfortunatamente non esiste il supporto "pseudo" con JavaScript e HTML5 ora.

Se capisco la tua domanda, puoi eseguire la convalida con Javascript. Tuttavia, tieni presente che è molto facile aggirare la convalida lato client, in particolare la convalida javascript . Non dovresti mai fidarti dei dati del client e controllare sempre sul lato server.

Ad esempio, potrei facilmente trovare gli ID degli elementi ispezionando il codice sorgente, quindi document.getElementById('some_id').setAttribute('max', new_number)modificare il valore massimo (questa era una delle voci dal tuo link).

Ci sono vari modi per farlo, quindi cercherò di darti l'idioma generale.

Puoi afferrare il valore facendo document.getElementById('form_element_id').value(assicurati di dare il modulo a nameche viene inviato al server e uno idche viene utilizzato da javascript). Per le aree di testo, puoi usare .innerHTML.

Quindi hai il valore in una variabile, ci sono vari modi per verificarlo.

Ad esempio, potresti farlo if (parseInt(my_value) < 0) //error. Potresti anche usare espressioni regolari, non spiegherò tutto ma potresti iniziare qui http://www.w3schools.com/jsref/jsref_obj_regexp.asp . So che w3schools non è la migliore fonte ma trovo che sia un buon punto di partenza.

Ora per la parte di convalida: aggiungi onsubmit="return validateForm()al tag del modulo dove validateForm () è la funzione che fa tutto il controllo. E la funzione restituisce solo truese valida e falsealtrimenti. Questo sovrascrive la funzione di convalida predefinita (che per impostazione predefinita non fa nulla).

Quindi, nell'esempio sopra, //errorsarebbe sostituito da return false. Puoi fare anche altre cose; come avvisare l'errore, quindi restituire falso. Puoi anche usare javascript per evidenziare i campi non validi (non sono sicuro se questo è ciò che intendi con " contrassegna un campo di input come non valido / valido da javascript ")

Ovviamente, se non vuoi controllare tutti i campi devi solo restituire true se quelli determinati passano. Ancora una volta, non dovresti fare affidamento su questo, ma se vuoi solo scoraggiare le persone nella media, allora è una soluzione facile.

C'è un modo per contrassegnare un campo di input come non valido / valido da javascript?

Sfortunatamente, non puoi modellare le pseudo classi in JavaScript, poiché non sono elementi reali, non esistono nel DOM effettivo.

Con JavaScript vanilla useresti l' API di convalida .

In jQuery puoi semplicemente farlo, http://jsfiddle.net/elclanrs/Kak6S/

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

O in alternativa, posso ignorare il metodo di convalida utilizzato?

Se stai utilizzando la convalida HTML5, attieniti al markup. Altrimenti, puoi disabilitare la convalida HTML5 con $form.attr('novalidate', 'novalidate')e utilizzare JS per convalidare i tuoi campi, quindi aggiungere valido le invalidclassi dove necessario. Ho creato un plugin che funziona in questo modo per supportare i browser non HTML5.