Validieren Sie die Auswahlbox

Question

Ich verwende das jQuery-Plugin Validation, um ein Formular zu validieren. Ich habe eine Auswahlliste wie folgt aussehen:

<select id="select"> 
<option value="">Choose an option</option> 
<option value="option1">Option1</option> 
<option value="option2">Option2</option> 
<option value="option3">Option3</option> 
</select> 

Nun, ich möchte sicherstellen, dass der Benutzer etwas anderes als „eine Option auswählen“ (das ist die Standardeinstellung eins). Damit wird es nicht validiert, wenn Sie die erste Option wählen. Wie kann das gemacht werden?

Answer 1

Fügen Sie einfach eine Klasse erforderlich ist, um die Auswahl

<select id="select" class="required"> 

Answer 2

Für den Anfang können Sie "disable" aus der Option versehentlich von Benutzern ausgewählt werden:

<option value="" disabled="disabled">Choose an option</option> 

Dann in Ihrem JavaScript-Event (spielt keine Rolle, ob es jQuery oder JavaScript ist), für das Formular zu überprüfen, ob er eingestellt ist, tun:

select = document.getElementById('select'); // or in jQuery use: select = this; 
if (select.value) { 
    // value is set to a valid option, so submit form 
    return true; 
} 
return false; 

Oder etwas in diesem Sinne.

Answer 3

<script type="text/JavaScript"> 
function validate() 
{ 
if(document.form1.quali.value == "-1") 
    { 
    alert("Please select qualification!"); 
    return false; 
    } 
} 

</script> 
<form name="form1" method="post" action="" onsubmit="return validate(this);"> 
<select name="quali" id="quali" "> 
     <option value="-1" selected="selected">select</option> 
     <option value="1">Graduate</option> 
     <option value="2">Post Graduate</option> 
     </select> 
</form> 





// this code works 110% tested by me after many complex jquery method validation but it is simple javascript method plz try this if u fail in drop down required validation// 

Answer 4

Ich weiß nicht, wie war die Plugin Zeit die Frage (2009) wurde gefragt, aber ich konfrontierte heute das gleiche Problem und es auf diese Weise gelöst:

1. Geben Sie Ihren Tag select ein Namensattribut Zum Beispiel in diesem Fall

   <select name="myselect">

2. Statt mit dem Attribut value = "default" in der Tag-Option arbeiten, deaktivieren Sie die Standardoption, wie durch Jeremy Visser oder Sollwert vorgeschlagen = ""

   <option disabled="disabled">Choose...</option>

   oder

   <option value="">Choose...</option>

3. die Regel Plugin Validierungsset

   $("#YOUR_FORM_ID").validate({ rules: { myselect: { required: true } } });

   oder

   <select name="myselect" class="required">

Obs: redsquare-Lösung funktioniert nur, wenn Sie nur eine auswählen, die in Form haben. Wenn Sie möchten, dass seine Lösung mit mehr als einer Option funktioniert, fügen Sie Ihrer Auswahl ein Namensattribut hinzu.

Hoffe es hilft! :)

Answer 5

<select id='bookcategory' class="form-control" required=""> 
        <option value="" disabled="disabled">Category</option> 
        <option value="1">LITERATURE & FICTION</option> 
        <option value="2">NON FICTION</option> 
        <option value="3">ACADEMIC</option> 
      <option value="4">CHILDREN & TEENS</option> 

       </select> 

HTML Formular Validierung kann automatisch vom Browser durchgeführt werden. Probieren Sie den obigen Code:
Der Rest wird automatisch erledigt, keine Notwendigkeit, js Funktionen nur dieses Dropdown und eine Schaltfläche senden zu erstellen.

Answer 6

if (select == "") { 
    alert("Please select a selection"); 
    return false; 

Das sollte für Sie arbeiten. Es hat nur für mich getan.

Answer 7

Vielleicht gibt es einen kürzeren Weg, aber das funktioniert für mich.

<script language='JavaScript' type='text/javascript'> 
    function validateThisFrom(thisForm) { 
     if (thisForm.FIELDNAME.value == "") { 
      alert("Please make a selection"); 
      thisForm.FIELDNAME.focus(); 
      return false; 
     } 
     if (thisForm.FIELDNAME2.value == "") { 
      alert("Please make a selection"); 
      thisForm.FIELDNAME2.focus(); 
      return false; 
     } 
    } 
</script> 
<form onSubmit="return validateThisFrom (this);"> 
    <select name="FIELDNAME" class="form-control"> 
     <option value="">- select -</option> 
     <option value="value 1">Visible info of Value 1</option> 
     <option value="value 2">Visible info of Value 2</option> 
    </select> 
    <select name="FIELDNAME2" class="form-control"> 
     <option value="">- select -</option> 
     <option value="value 1">Visible info of Value 1</option> 
     <option value="value 2">Visible info of Value 2</option> 
    </select> 
</form> 

Answer 8

Sie möchten sicherstellen, dass der Benutzer nichts anderes auswählt als "Wählen Sie eine Option" (was die Standardeinstellung ist). Damit wird es nicht validiert, wenn Sie die erste Option wählen. Wie kann das gemacht werden?

Sie können dies tun, indem Sie im select-Tag das Attribut required = "required" hinzufügen. Sie können es in unten Code sehen

<select id="select" required="required"> 
<option value="">Choose an option</option> 
<option value="option1">Option1</option> 
<option value="option2">Option2</option> 
<option value="option3">Option3</option> 
</select> 

Es funktionierte gut für mich bei chorme, firefox und Internet Explorer. Danke