2012-10-17 12 views
6

È possibile forzare/richiedere a un utente di effettuare una selezione da un menu a discesa? viene selezionatoRichiesta di effettuare una selezione da un codice HTML a discesa 5

<form action=""> 
<select name="cars"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="fiat">Fiat</option> 
<option value="audi">Audi</option> 
</select> 
</form> 

Per impostazione predefinita "Volvo": Esempio. Quello che voglio è che il browser sappia che l'utente ha effettuato una selezione e non accetta l'impostazione predefinita automatica.

Sto pensando qualcosa di simile:

<form action=""> 
<select name="cars" required="required"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="fiat">Fiat</option> 
<option value="audi">Audi</option> 
</select> 
</form> 

Qualche consiglio?

+0

Aggiungi un'opzione in più, ad esempio ''. Il tuo attuale desiderio ha una piccola supervisione: come sceglierebbe l'utente se Volvo dovesse rifiutare l'opzione predefinita? –

+0

Diciamo che ho fatto l'opzione predefinita e l'utente ha provato a inviare senza modificare quell'opzione se non dovesse inviare "- Selezionare un'opzione -"? –

+0

Sì. Verificheresti che dal lato del server (ovviamente) e richiedi un nuovo input se non è valido. –

risposta

1

Ho ottimizzato un esempio da jquery validate per farlo funzionare correttamente. So che nella tua domanda iniziale hai chiesto che fosse basato su HTML5, ma forse questo esempio combinato è accettabile.

http://jsfiddle.net/36MkJ/

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
    <script> 
     $(document).ready(function(){ 
      $("#carsForm").validate(); 
     }); 
    </script> 
</head> 
<body> 
<form class="cmxform" id="carsForm" method="get" action=""> 
    <select name="cars" class="required"> 
     <option value="">Select a car</option> 
     <option value="volvo">Volvo</option> 
     <option value="saab">Saab</option> 
     <option value="fiat">Fiat</option> 
     <option value="audi">Audi</option> 
    </select> 
    <p> 
     <input class="submit" type="submit" value="Submit"/> 
    </p> 
</form> 

originale Esempio era in http://docs.jquery.com/Plugins/Validation