jQuery convalida visualizza gli errori come inline per impostazione predefinita, necessario modificare questo per inline-block

Sto usando il jQuery Validation Plugin jQuery convalida visualizza gli errori come inline per impostazione predefinita, necessario modificare questo per inline-block

Come faccio a cambiare i messaggi di errore generati display valore inline-block quando non è nascosto?

Ho provato con CSS ma il jQuery sovrascrive questo.

fonte

2012-04-17 Clinton Green

Dov'è il tuo codice? Cosa hai fatto fino ad ora? – Sparky

Ciao, sfortunatamente questo è un progetto interno quindi non posso indirizzarti a un link. Sto cercando di trovare dove il jquery dice al codice di aggiungere display: in linea con l'etichetta di errore quando viene visualizzato, e modificare quello per visualizzare: blocco in linea –

Non ti ho chiesto di pubblicare un link. Tuttavia, basta guardare all'interno del plugin e personalizzare secondo necessità ... è solo jQuery/JavaScript. – Sparky

Utilizzare l'opzione errorClass per specificare la classe assegnata ai messaggi di errore e gli elementi di errore:

$(".selector").validate({ 
    errorClass: "invalid" 
}) 

<style type="text/css"> 
    .invalid { 
    display: inline-block !important; 
    } 
</style>

Vedere la documentazione per le opzioni del validatore:

http://docs.jquery.com/Plugins/Validation/validate#options

fonte

2012-04-17 23:22:03 leepowers

Con questo, è impossibile nascondere gli errori una volta che il campo è valido – jetlej

Concordato con @jetlej, Questo interrompe la funzionalità di convalida come display: nessuno generato dal plugin per nascondere il messaggio di errore di convalida non necessario non viene più ascoltato a causa di! important. –

Se si utilizza !important sul CSS, dovrebbe avere la precedenza su quello che fa jQuery:

.error { 
    display: inline-block !important; 
}

fonte

2012-04-17 23:21:04

Grazie, l'ho provato ma non ha funzionato –

Hmm, funziona per me ... Hai guardato in Firebug, o un altro debugger per vedere quale stile è applicato e cosa è facendo sì che il 'inline-block' non venga applicato? –

Lo stile in linea del plug-in sovrascrive il CSS –

jQuery validate non ha nessuno stile CSS definito. Stai usando altre librerie con le definizioni CSS per la classe "error"?

Ecco JsFiddle codice di esempio con jQuery convalidare utilizzando inline-block per il messaggio di errore:

http://jsfiddle.net/maxim75/HKnQD/4/

.error 
{ 
    color: Red; 
    display: inline-block; 
}

aprirlo e controllare nel browser:

enter image description here

fonte

2012-04-18 00:38:03

Ciao, grazie, l'ho capito ieri mentre testavo le risposte che ho ricevuto. Saluti –

Mi sono imbattuto in questo e non ho potuto usare CSS dato che jQuery sta usando i metodi show() e hide() sull'elemento error (che imposta "display: block;" inline) dopo la creazione iniziale. Invece puoi usare i metodi highlight e unhighlight del plugin validate per cambiare i css inline.

errorElement: 'em', 

highlight: function(element, errorClass) { 
    $(element).addClass(errorClass); // good for changing field backgrounds 
    $(element).next('em').css('display','inline'); // keeps error message layout clean 
}, 

unhighlight: function(element, errorClass) { 
     $(element).removeClass(errorClass); // good for changing field backgrounds 
     $(element).next('em').css('display','none'); // keeps error message layout clean 
},

fonte

2013-01-28 21:50:55 matlembo

Grazie amico. Cheers –

Questa è la risposta corretta – hamishtaplin

jQuery convalida visualizza gli errori come inline per impostazione predefinita, necessario modificare questo per inline-block

risposta

Problemi correlati