controllo campo select nel form

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Lo so che l'argomento è stato trattato in mille modi ma ho letto mille guide ma non ne vengo a capo. Io ho un fomr con un select dove l'utente sceglie la sua data di nascita così
HTML:
                	<p>
                    	<label for="eta" class="block">Et&agrave;:</label>
                    	<select class="select" name="eta" id="eta" onchange="sel_eta()">
                        		<option value="0">Seleziona</option>
	                            <option value="1">+50</option>
    	                        <option value="2">30-50</option>
        	                    <option value="3">11-29</option>
            	                <option value="4">1-10</option>
                        </select>
                    </p>
e nel codice html viene richiamato un file javascript che dovrebbe controllare live se il campo è stato selezionato. i lcodice è questo
HTML:
			'eta' : function() {

				$('body').append('<div id="etaInfo" class="info"></div>');

				var etaInfo = $('#etaInfo');
				var ele = $('#eta');
				var pos = ele.offset();

				etaInfo.css({
					top: pos2.top-3,
					left: pos2.left+ele2.width()+25
				});

				if(document.jform.ele.value == 0) {
					jVal.errors = true;
					etaInfo.removeClass('correct').addClass('error').html('&larr; Quanti anni hai?').show();
					etaInfo.removeClass('normal').addClass('wrong');
				} else {
					jVal.errors = false;
					etaInfo.removeClass('error').addClass('correct').html('&radic;').show();
					etaInfo.removeClass('wrong').addClass('normal');
					}
				}
il problema è che non riesco a capire come impostare il controllo del campo. Al controllo se positivo appare un flag verde se negativo una riga di testo che avvisa di selezionare la data. come posso risolvere?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
una soluzione semplice
HTML:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#eta").change(function(){
            var sel = $("#eta option:selected").val();
            if(sel==0)
                $("#verifica").html("&larr; Quanti anni hai?");
            else 
                $("#verifica").html("V");// qui puoi inserire un immagine
        })
    })
    
</script>
<p>
    <label for="eta" class="block">Et&agrave;:</label>
    <select class="select" name="eta" id="eta">
        <option value="0">Seleziona</option>
        <option value="1">+50</option>
        <option value="2">30-50</option>
        <option value="3">11-29</option>
        <option value="4">1-10</option>
    </select>
    <span id="verifica">&larr; Quanti anni hai?</span>
</p>
 

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Ciao criric, grazie, il tuo suggerimento funziona, io vorrei invece integrare il tuo suggerimento con le modalità di avviso che appaiono quando clicco su invia. Al momento di inviare il form mi appaiono dei box lato input che mi avvisano che il campo è vuoto, vorrei fare lo stesso. Sapresti darmi qualche dritta? Il codice che ho messo qua
HTML:
'eta' : function() {

				$('body').append('<div id="etaInfo" class="info"></div>');

				var etaInfo = $('#etaInfo');
				var ele = $('#eta');
				var pos = ele.offset();

				etaInfo.css({
					top: pos2.top-3,
					left: pos2.left+ele2.width()+25
				});

				if(document.jform.ele.value == 0) {
					jVal.errors = true;
					etaInfo.removeClass('correct').addClass('error').html('&larr; Quanti anni hai?').show();
					etaInfo.removeClass('normal').addClass('wrong');
				} else {
					jVal.errors = false;
					etaInfo.removeClass('error').addClass('correct').html('&radic;').show();
					etaInfo.removeClass('wrong').addClass('normal');
					}
				}
è il controllo del campo
poi il tutto viene legato con questi valori
HTML:
$('#send').click(function (){
		var obj = $.browser.webkit ? $('body') : $('html');
		obj.animate({ scrollTop: $('#jform').offset().top }, 750, function (){
			jVal.errors = false;
			jVal.nome();
			jVal.cognome();
			jVal.email();
			jVal.eta();
			jVal.messaggio();
			jVal.sendIt();
		});
		return false;
	});
e questo
HTML:
$('#nome').change(jVal.nome);
	$('#cognome').change(jVal.cognome);
	$('#eta').change(jVal.eta);
	$('#email').change(jVal.email);
	$('#messaggio').change(jVal.messaggio);

});
Grazie
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
cambia questo
Codice:
if(document.jform.ele.value == 0) {
con questo
Codice:
if(document.jform.eta.value == 0) {
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
a me ha funzionato
HTML:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#eta").change(function(){
            $('body').append('<div id="etaInfo" class="info"></div>');

            var etaInfo = $('#etaInfo');       
        
            if(document.jform.eta.value == 0) {            
                etaInfo.removeClass('correct').addClass('error').html('&larr; Quanti anni hai?').show();
                etaInfo.removeClass('normal').addClass('wrong');
            } else {            
                etaInfo.removeClass('error').addClass('correct').html('&radic;').show();
                etaInfo.removeClass('wrong').addClass('normal');
            }
        })			
    })
    
</script>
<form name="jform">
    <p>
        <label for="eta" class="block">Et&agrave;:</label>
        <select class="select" name="eta" id="eta">
            <option value="0">Seleziona</option>
            <option value="1">+50</option>
            <option value="2">30-50</option>
            <option value="3">11-29</option>
            <option value="4">1-10</option>
        </select>
    </p>
</form>
controlla la sintassi,anche una virgola puo impedire il funzionamento
 

Paperino78

Utente Attivo
30 Giu 2012
409
0
16
Milano
Ho cambiato un pochino l'impostazine, ma adesso mi appare sempre l'ok anche quando non seleziono alcun valore. Premetto ho cambiato da selettore a radio button, e ho messo così il codice. Chi mi sa spiegare come mai mi da sempre esito positivo anche quando non seleziono nessuna voce?
markup
HTML:
<p>
		<label for="eta" class="block">Et&agrave;:</label>
		<input id="zero_dieci" type="radio" name="eta" />
		<label for="zero_dieci">1-10 anni</label>
		<input id="undici_trenta" type="radio" name="eta" />
		<label for="undici_trenta">11-30 anni</label>
		<input id="trenta_cinquanta" type="radio" name="eta" />
		<label for="trenta_cinquanta">31-50 anni</label>
		<input id="plus_cinquanta" type="radio" name="eta" />
		<label for="plus_cinquanta">+50 anni</label>
		</p>

e codice JS
HTML:
	'eta' : function() {

			$('body').append('<div id="etaInfo" class="info"></div>');

			var etaInfo = $('#etaInfo');
			var ele = $('#plus_cinquanta');
			var pos = ele.offset();

			etaInfo.css({
				top: pos.top-8,
				left: pos.left+ele.width()+88
			});


			if($('input[name="eta"]:checked').lenght == true){
				jVal.errors = true;
				etaInfo.removeClass('correct').addClass('error').html('&larr; Quanti anni hai?').show();
				ele.removeClass('normal').addClass('wrong');
			} else {
				etaInfo.removeClass('error').addClass('correct').html('&radic;').show();
				ele.removeClass('wrong').addClass('normal');
			}
		},
in questa occasione se io do invio senza aver compilato il form mi appaiono tutti gli errori tranne quello sull'età che mi da esito corretto.
 
Discussioni simili
Autore Titolo Forum Risposte Data
M [PHP] Controllo campo cap con trattino oltre ai numeri PHP 3
M [PHP] Help: controllo valori inseriti in un campo PHP 1
elpirata [Javascript] Controllo su campo ricerca data Javascript 1
P Controllo valori duplicati in un campo a Maschere continue MS Access 0
F controllo campo input PHP 15
A controllo su valore da campo textarea non funziona PHP 7
pup3770 Controllo su campo prima di inserire PHP 5
Eugene Controllo numero caratteri campo input Javascript 6
C controllo campo email e checkbox Javascript 18
T javascript controllo campo e sostituzione lettere... Javascript 3
M Campo evidenzia e controllo mese sto impazzendo PHP 2
T campo typename in un controllo objectDataSource ASP.NET 3
P Aggiungi evento di controllo campo testo Ajax 11
G Access 2003 Runtime: Campo Calcolato in Origine controllo di una casella di testo MS Access 1
R Controllo lettura campo PHP 2
S controllo campo testo Javascript 2
E campo controllo in formail php PHP 1
M Modificare uno script per il controllo campo telefono Javascript 0
M problema controllo campo numerico PHP 1
E javascript controllo campo Javascript 10
T UpLoad, controllo campo & rinominafile Classic ASP 3
M pulsante per aprire una maschera che contiene controllo schede MS Access 0
G [PHP] Creare script di prenotazione con controllo disponibilità. PHP 7
Z Controllo giorni MYSQL PHP 0
M Problema con controllo form in real time jQuery 6
MarcoGrazia jquery validate() controllo checkbox jQuery 2
M Controllo del codice fiscale/partita iva PHP 11
S Software windows10 per controllo contenuti web Windows e Software 6
S Controllo appuntamenti disponibili sul db PHP 5
L input (controllo se è stato modificato o no). PHP 1
W Controllo competitors serp SEO e Posizionamento 2
bubino8 [Javascript] popup di controllo elimina dopo window.print(); Javascript 0
M [MS Access] controllo valido se MS Access 8
MarkRed Come indicare, in una maschera, il primo controllo d'input, tipo "SetFocus" jQuery 9
C [PHP] Controllo <select> comportamento anomalo PHP 2
elpirata [Javascript] Controllo campi required non effettuato Javascript 2
A [PHP] Controllo nome utente form di registrazione PHP 4
L [PHP] controllo dimensione immagine per il resize PHP 2
M [ASP] Upload file da form controllo Classic ASP 5
P [PHP] Controllo al checkbox privacy PHP 6
S [MySQL] Controllo dati di una tabella in tempo reale MySQL 0
T [php] controllo su estensione file PHP 7
M [PHP] Script per controllo disponibilitá negozio in citta PHP 4
I Recupero accesso pannello di controllo dominio Leggi, Normative e Fisco 2
F Controllo dati sui campi di input tramite php PHP 1
R [MS Access] CONDIZIONE CHE CAMBIA PROPRIETA' DI UNA CONTROLLO MS Access 7
M [PHP] Dubbio controllo IF PHP 15
Fede72 Controllo registrazioni PHP Mysql PHP 5
L jquery e json controllo valori da determinate chiavi - keys jQuery 0
T [Javascript] un controllo con checkbox che non... controlla... Javascript 3

Discussioni simili