simple, css menu à onglets non représentés

Question

submit

suis juste Startin nouveau ici ... Je possède ce onglets avec css jquery ..

<ul class="tabs"> 
<li><a href="#tab1">First tab</a></li> 
<li><a href="#tab2">Second tab</a></li> 
</ul> 

<div class="tab_container"> 
<div id="tab1" class="tab_content"> 
    Content of the first tab 
</div> 
<div id="tab2" class="tab_content"> 
Content 
</div> 

myjquery

<script type="text/javascript"> 
    $(document).ready(function() { 
    //Default Action 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 
    //On Click Event 
    $("ul.tabs li").click(function() { 
    $("ul.tabs li").removeClass("active"); //Remove any "active" class 
    $(this).addClass("active"); //Add "active" class to selected tab 
    $(".tab_content").hide(); //Hide all tab content 
    var activeTab = $(this).find("a").attr("href"); 
     $(activeTab).fadeIn(); //Fade in the active content 
     return false; 
     }); 
     }); 
     </script> 

il fonctionne bien avec la forme champs, mais quand j'ajouter bouton soumettre après les champs de formulaire il disparaît .. mais quand seulement soumettre le bouton (pas d'autres champs de formulaire) est utilisé .. il est montré .. j'ai essayé de changer les paramètres CSS, mais n'a pas pu comprendre ... je fais de mon mieux pour être clair ici ..

et le css

 ul.tabs { 
     margin: 0; 
     padding: 0; 
     float: left; 
     list-style: none; 
     height: 32px; /*--Set height of tabs--*/ 
     border-bottom: 1px solid #999; 
     border-left: 1px solid #999; 
     width: 100%; 
       } 

     ul.tabs li { 
     float: left; 
     margin: 0; 
     padding: 0; 
     height: 31px; /*--Subtract 1px from the height of the unordered list--*/ 
     line-height: 31px; /*--Vertically aligns the text within the tab--*/ 
     border: 1px solid #999; 
     border-left: none; 
     margin-bottom: -1px; /*--Pull the list item down 1px--*/ 
     overflow: hidden; 
     position: relative; 
     background: #e0e0e0; 
     } 

     ul.tabs li a { 
     text-decoration: none; 
     color: #000; 
    display: block; 
    font-size: 1.2em; 
    padding: 0 20px; 
    border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ 
    outline: none; 
    } 

    ul.tabs li a:hover { 
    background: #ccc; 
    } 

    html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ 
    background: #fff; 
    border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ 
    } 

    .tab_container { 
    border: 1px solid #999; 
    border-top: none; 
    overflow: hidden; 
    clear: both; 
    float: left; width: 100%; 
    background: #fff; 
    } 

    .tab_content { 
    padding: 20px; 
    font-size: 1.2em; 
    color:#333; 
    } 

pls aide !! wat je fais mal ...

mon code html sous forme

    <label for="username" id="name_label">Username</label><br> 
       <input id="username" type="text" name="username"/><br> 

       <label for="password" id="name_label">Password</label><br> 
       <input id="password" type="text" name="password"/><br> 

       <label for="confirm_password" id="name_label">Confirm Password</label>    <br> 
       <input id="confirm_password" type="text" name="confirm_password"/><br> 

        <br> 
       <b>Personal Details</b><br><br> 

       <label for="firstname" id="name_label">Firstname</label><br> 
       <input id="firstname" type="text" name="firstname"/><br> 

       <label for="lastname" id="name_label">Lastname</label><br> 
       <input id="lastname" type="text" name="lastname"/><br> 

       Gender<br> 
       <select class="cc" name="sex" id="sex"> 
       <option value="" selected="selected">--Select Gender--</option> 
       <option value="m">Male</option> 
       <option value="f">Female</option> 
       </select> 

       <br> 

       Date of birth<br> 

       <label class="dob" for="dateid" id="date_label">Date 
       <?php $number = range(1,31); 
       $tempholder = range(1,31); 
       $nr=31; 
       echo '<select class="doba" name="dateid" id="dateid">'; 
       echo '<option value="" selected="selected">--Select Date--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 

       echo "<option>".$tempholder[$i]."</option>"; 
       } 
      echo '</select>'; 

       ?> 
       </label> 



       <label class="dob" for="month" id="month_label">Month 
       <?php $number = range(1,12); 
       $tempholder = range(1,12); 
       $nr=12;    
       echo '<select class="doba" name="month" id="month">'; 
       echo '<option value="" selected="selected">--Select Month--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 

       echo "<option>".$tempholder[$i]."</option>"; 
       } 
      echo '</select>'; 

       ?> 
       </label> 

       <label class="dob" for="year" id="year_label">Year 
       <?php 
       $tempholder = range(1960,2000); 
       $nr=40; 
       echo ' <select class="doba" name="year" id="year">'; 
       echo '<option value="" selected="selected">--Select Year--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 
       echo "<option>".$tempholder[$i]."</option>"; 
       } 
     echo '</select>'; 

      ?> 
      </label> 
      <br> 

      <b>Contact Details</b> <br> 
      <label for="add1" id="add1_label">Address1</label><br> 
      <input id="add1" type="text" name="add1"/><br> 

      <label for="add2" id="add2_label">Address2</label><br> 
      <input id="add2" type="text" name="add2"/><br> 

      <label for="add3" id="add3_label">Address3</label><br> 
      <input id="add3" type="text" name="add3"/><br> 

      <label for="mobile" id="mobile_label">Mobile</label><br> 

      <input id="mobile" type="text" name="mobile"/><br> 

      <label for="tele" id="tele_label">Telephone</label><br> 


       <input id="tele" type="text" name="tele"/><br> 

       <label for="email" id="email_label">E-mail</label><br> 
       <input id="email" type="text" name="email"/><br> 

       <br> 


       <b>Card Details</b><br> 
       <label for="cardno" id="cardno_label">Card No</label><br> 
       <input id="cardno" type="text" name="cardno"/><br> 

      <label for="cvcno" id="cvcno_label">CVC No</label><br> 
      <input id="cvcno" type="text" name="cvcno"/><br> 


      <label class="dob" for="dateid" id="date_label">Expiry Date<br> 
      <?php $number = range(1,31); 
      $tempholder = range(1,31); 
      $nr=31; 
      echo '<select class="doba" name="dateid" id="dateid">'; 
      echo '<option value="" selected="selected">--Select Date--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 

      echo "<option>".$tempholder[$i]."</option>"; 
      } 
     echo '</select>'; 

      ?> 
      </label> 



      <label class="dob" for="month" id="month_label">Month 
      <?php $number = range(1,12); 
      $tempholder = range(1,12); 
      $nr=12; 
      echo '<select class="doba" name="month" id="month">'; 
      echo '<option value="" selected="selected">--Select Month--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 

      echo "<option>".$tempholder[$i]."</option>"; 
      } 
     echo '</select>'; 

      ?> 
      </label> 

      <label class="dob" for="year" id="year_label">Year 
      <?php 
      $tempholder = range(2013,2050); 
      $nr=40; 
      echo ' <select class="doba" name="year" id="year">'; 
      echo '<option value="" selected="selected">--Select Year--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 
      echo "<option>".$tempholder[$i]."</option>"; 
      } 
      break; 
     echo '</select>'; 

      ?> 
      </label> 

      <br> 
      <select name="cardtype" id="cardtype"> 
      <option value="" selected="selected">--Card Type--</option> 
      <option value="visa">Visa</option> 
      <option value="master">Master</option> 
      <option value="american">American Express</option> 
      </select> 

      <input type="submit" value="enter"/> 

Answer 1

Erreur # 1:

vous salit la Labels mettre SelectBoxes à l'intérieur.

Fermer une Label puis ouvrez une SelectBox, au lieu d'encapsuler un SelectBox dans sa propre label (exactement comme vous le faites pour les champs d'entrée).

Erreur # 2:

ID s (et peut-être name s) doit être unique (selon un DTD décent).

Vous doublez dateid, month, year. Divisez-les pour les rendre uniques, comme dateid1 et dateid2, etc ...

Commencez à corriger le code, puis réessayez et éventuellement mettez à jour votre réponse si elle ne fonctionne toujours pas.

Answer 2

I ajouté 30 entrées et passer d'un onglet à un autre parfaitement.

<ul class="tabs"> 
    <li><a href="#tab1">First tab</a></li> 
    <li><a href="#tab2">Second tab</a></li> 
</ul> 
<div class="tab_container"> 
<div id="tab1" class="tab_content"> Content of the first tab </div> 
<div id="tab2" class="tab_content"> Content 
    <form id="form1" name="form1" method="post" action=""> 
    <label> 
     <input type="text" name="textfield" id="textfield" /> 
    </label> 
    <label> 
     <input type="text" name="textfield2" id="textfield2" /> 
    </label> 
    <label> 
     <input type="text" name="textfield3" id="textfield3" /> 
    </label> 
    <label> 
     <input type="text" name="textfield4" id="textfield4" /> 
    </label> 
    <label> 
     <input type="text" name="textfield5" id="textfield5" /> 
    </label> 
    <label> 
     <input type="text" name="textfield6" id="textfield6" /> 
    </label> 
    <label> 
     <input type="text" name="textfield7" id="textfield7" /> 
    </label> 
    <label> 
     <input type="text" name="textfield8" id="textfield8" /> 
    </label> 
    <label> 
     <input type="text" name="textfield9" id="textfield9" /> 
    </label> 
    <label> 
     <input type="text" name="textfield10" id="textfield10" /> 
    </label> 
    <label> 
     <input type="text" name="textfield11" id="textfield11" /> 
    </label> 
    <label> 
     <input type="text" name="textfield12" id="textfield12" /> 
    </label> 
    <label> 
     <input type="text" name="textfield13" id="textfield13" /> 
    </label> 
    <label> 
     <input type="text" name="textfield14" id="textfield14" /> 
    </label> 
    <label> 
     <input type="text" name="textfield15" id="textfield15" /> 
    </label> 
    <label> 
     <input type="text" name="textfield16" id="textfield16" /> 
    </label> 
    <label> 
     <input type="text" name="textfield17" id="textfield17" /> 
    </label> 
    <label> 
     <input type="text" name="textfield18" id="textfield18" /> 
    </label> 
    <label> 
     <input type="text" name="textfield19" id="textfield19" /> 
    </label> 
    <label> 
     <input type="text" name="textfield20" id="textfield20" /> 
    </label> 
    <label> 
     <input type="text" name="textfield21" id="textfield21" /> 
    </label> 
    <label> 
     <input type="text" name="textfield22" id="textfield22" /> 
    </label> 
    <label> 
     <input type="text" name="textfield23" id="textfield23" /> 
    </label> 
    <label> 
     <input type="text" name="textfield24" id="textfield24" /> 
    </label> 
    <label> 
     <input type="text" name="textfield25" id="textfield25" /> 
    </label> 
    <label> 
     <input type="text" name="textfield26" id="textfield26" /> 
    </label> 
    <label> 
     <input type="text" name="textfield27" id="textfield27" /> 
    </label> 
    <label> 
     <input type="text" name="textfield28" id="textfield28" /> 
    </label> 
    <label> 
     <input type="text" name="textfield29" id="textfield29" /> 
    </label> 
    <label> 
     <input type="text" name="textfield30" id="textfield30" /> 
    </label> 
    <label> 
     <input type="submit" name="button" id="button" value="Submit" /> 
    </label> 
    </form> 
</div> 

Answer 3

<ul class="myMenu"> 
    <li><a href="#">menu item 1</a></li> 
    <li><a href="#">menu item 2</a> 
     <ul> 
      <li><a href="#">sub menu item 1</a></li> 
      <li><a href="#">sub menu item 2</a></li> 
      <li><a href="#">sub menu item 3</a></li> 
      <li><a href="#">sub menu item 4</a></li> 
     </ul> 
    </li> 
    <li><a href="#">menu item 3</a> 
     <ul> 
      <li><a href="#">sub menu item 1</a></li> 
      <li><a href="#">sub menu item 2</a></li> 
      <li><a href="#">sub menu item 3</a></li> 
      <li><a href="#">sub menu item 4</a></li> 
     </ul> 
    </li> 
    <li><a href="#">menu item 4</a></li> 
    <li><a href="#">menu item 5</a></li> 
</ul> 

Now we're going to style the list with css: 

/*style the main menu*/ 
.myMenu { 
    margin:0; 
    padding:0; 
} 

.myMenu li { 
    list-style:none; 
    float:left; 
    font:12px Arial, Helvetica, sans-serif #111; 
} 

.myMenu li a:link, .myMenu li a:visited { 
    display:block; 
    text-decoration:none; 
    background-color:#09F; 
    padding: 0.5em 2em; 
    margin:0; 
    border-right: 1px solid #fff; 
    color:#111; 
} 

.myMenu li a:hover { 
    background-color:#0CF; 
} 

/*style the sub menu*/ 
.myMenu li ul { 
    position:absolute; 
    visibility:hidden; 
    border-top:1px solid #fff; 
    margin:0; 
    padding:0; 
} 

.myMenu li ul li { 
    display:inline; 
    float:none; 
} 

.myMenu li ul li a:link, .myMenu li ul li a:visited { 
    background-color:#09F; 
    width:auto; 
} 

.myMenu li ul li a:hover { 
    background-color:#0CF; 
} 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.myMenu > li').bind('mouseover', openSubMenu); 
     $('.myMenu > li').bind('mouseout', closeSubMenu); 

     function openSubMenu() { 
      $(this).find('ul').css('visibility', 'visible');  
     }; 

     function closeSubMenu() { 
      $(this).find('ul').css('visibility', 'hidden'); 
     }; 

    }); 
</script> 

Ici vous allez.

Answer 4

Pourquoi avez-vous besoin pause à l'année liste déroulante, essayez d'enlever cela.

Votre code complet

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
    //Default Action 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 
    //On Click Event 
    $("ul.tabs li").click(function() { 
    $("ul.tabs li").removeClass("active"); //Remove any "active" class 
    $(this).addClass("active"); //Add "active" class to selected tab 
    $(".tab_content").hide(); //Hide all tab content 
    var activeTab = $(this).find("a").attr("href"); 
     $(activeTab).fadeIn(); //Fade in the active content 
     return false; 
     }); 
     }); 
     </script> 
<style type="text/css"> 
ul.tabs { 
    margin: 0; 
    padding: 0; 
    float: left; 
    list-style: none; 
    height: 32px; /*--Set height of tabs--*/ 
    border-bottom: 1px solid #999; 
    border-left: 1px solid #999; 
    width: 100%; 
} 
ul.tabs li { 
    float: left; 
    margin: 0; 
    padding: 0; 
    height: 31px; /*--Subtract 1px from the height of the unordered list--*/ 
    line-height: 31px; /*--Vertically aligns the text within the tab--*/ 
    border: 1px solid #999; 
    border-left: none; 
    margin-bottom: -1px; /*--Pull the list item down 1px--*/ 
    overflow: hidden; 
    position: relative; 
    background: #e0e0e0; 
} 
ul.tabs li a { 
    text-decoration: none; 
    color: #000; 
    display: block; 
    font-size: 1.2em; 
    padding: 0 20px; 
    border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ 
    outline: none; 
} 
ul.tabs li a:hover { 
    background: #ccc; 
} 
html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ 
    background: #fff; 
    border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ 
} 
.tab_container { 
    border: 1px solid #999; 
    border-top: none; 
    overflow: hidden; 
    clear: both; 
    float: left; 
    width: 100%; 
    background: #fff; 
} 
.tab_content { 
    padding: 20px; 
    font-size: 1.2em; 
    color:#333; 
} 
</style> 
<ul class="tabs"> 
    <li><a href="#tab1">First tab</a></li> 
    <li><a href="#tab2">Second tab</a></li> 
</ul> 
<div class="tab_container"> 
<div id="tab1" class="tab_content"> 
<form id="form1" name="form1" method="post" action=""> 
<label for="username" id="name_label">Username</label> 
<br> 
<input id="username" type="text" name="username"/> 
<br> 
<label for="password" id="name_label">Password</label> 
<br> 
<input id="password" type="text" name="password"/> 
<br> 
<label for="confirm_password" id="name_label">Confirm Password</label> 
<br> 
<input id="confirm_password" type="text" name="confirm_password"/> 
<br> 
<br> 
<b>Personal Details</b><br> 
<br> 
<label for="firstname" id="name_label">Firstname</label> 
<br> 
<input id="firstname" type="text" name="firstname"/> 
<br> 
<label for="lastname" id="name_label">Lastname</label> 
<br> 
<input id="lastname" type="text" name="lastname"/> 
<br> 
Gender<br> 
<select class="cc" name="sex" id="sex"> 
    <option value="" selected="selected">--Select Gender--</option> 
    <option value="m">Male</option> 
    <option value="f">Female</option> 
</select> 
<br> 
Date of birth<br> 
<label class="dob" for="dateid" id="date_label">Date 
    <?php $number = range(1,31); 
       $tempholder = range(1,31); 
       $nr=31; 
       echo '<select class="doba" name="dateid" id="dateid">'; 
       echo '<option value="" selected="selected">--Select Date--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 

       echo "<option>".$tempholder[$i]."</option>"; 
       } 
      echo '</select>'; 

       ?> 
</label> 
<label class="dob" for="month" id="month_label">Month 
    <?php $number = range(1,12); 
       $tempholder = range(1,12); 
       $nr=12;    
       echo '<select class="doba" name="month" id="month">'; 
       echo '<option value="" selected="selected">--Select Month--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 

       echo "<option>".$tempholder[$i]."</option>"; 
       } 
      echo '</select>'; 

       ?> 
</label> 
<label class="dob" for="year" id="year_label">Year 
    <?php 
       $tempholder = range(1960,2000); 
       $nr=40; 
       echo ' <select class="doba" name="year" id="year">'; 
       echo '<option value="" selected="selected">--Select Year--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 
       echo "<option>".$tempholder[$i]."</option>"; 
       } 
     echo '</select>'; 

      ?> 
</label> 
<br> 
<b>Contact Details</b> <br> 
<label for="add1" id="add1_label">Address1</label> 
<br> 
<input id="add1" type="text" name="add1"/> 
<br> 
<label for="add2" id="add2_label">Address2</label> 
<br> 
<input id="add2" type="text" name="add2"/> 
<br> 
<label for="add3" id="add3_label">Address3</label> 
<br> 
<input id="add3" type="text" name="add3"/> 
<br> 
<label for="mobile" id="mobile_label">Mobile</label> 
<br> 
<input id="mobile" type="text" name="mobile"/> 
<br> 
<label for="tele" id="tele_label">Telephone</label> 
<br> 
<input id="tele" type="text" name="tele"/> 
<br> 
<label for="email" id="email_label">E-mail</label> 
<br> 
<input id="email" type="text" name="email"/> 
<br> 
<br> 
<b>Card Details</b><br> 
<label for="cardno" id="cardno_label">Card No</label> 
<br> 
<input id="cardno" type="text" name="cardno"/> 
<br> 
<label for="cvcno" id="cvcno_label">CVC No</label> 
<br> 
<input id="cvcno" type="text" name="cvcno"/> 
<br /> 
<label class="dob" for="dateid" id="date_label">Expiry Date<br> 
    <?php $number = range(1,31); 
      $tempholder = range(1,31); 
      $nr=31; 
      echo '<select class="doba" name="dateid" id="dateid">'; 
      echo '<option value="" selected="selected">--Select Date--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 

      echo "<option>".$tempholder[$i]."</option>"; 
      } 
     echo '</select>'; 

      ?> 
</label> 
<label class="dob" for="month" id="month_label">Month 
    <?php $number = range(1,12); 
       $tempholder = range(1,12); 
       $nr=12;    
       echo '<select class="doba" name="month" id="month">'; 
       echo '<option value="" selected="selected">--Select Month--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 

       echo "<option>".$tempholder[$i]."</option>"; 
       } 
      echo '</select>'; 

       ?> 
</label> 
<label class="dob" for="year" id="year_label">Year 
    <?php 
       $tempholder = range(1960,2000); 
       $nr=40; 
       echo ' <select class="doba" name="year" id="year">'; 
       echo '<option value="" selected="selected">--Select Year--</option>'; 
       for ($i=0; $i<$nr; $i++) 
       { 
       echo "<option>".$tempholder[$i]."</option>"; 
       } 
     echo '</select>'; 

      ?> 
</label> 
<br> 
<b>Contact Details</b> <br> 
<label for="add1" id="add1_label">Address1</label> 
<br> 
<input id="add1" type="text" name="add1"/> 
<br> 
<label for="add2" id="add2_label">Address2</label> 
<br> 
<input id="add2" type="text" name="add2"/> 
<br> 
<label for="add3" id="add3_label">Address3</label> 
<br> 
<input id="add3" type="text" name="add3"/> 
<br> 
<label for="mobile" id="mobile_label">Mobile</label> 
<br> 
<input id="mobile" type="text" name="mobile"/> 
<br> 
<label for="tele" id="tele_label">Telephone</label> 
<br> 
<input id="tele" type="text" name="tele"/> 
<br> 
<label for="email" id="email_label">E-mail</label> 
<br> 
<input id="email" type="text" name="email"/> 
<br> 
<br> 
<b>Card Details</b><br> 
<label for="cardno" id="cardno_label">Card No</label> 
<br> 
<input id="cardno" type="text" name="cardno"/> 
<br> 
<label for="cvcno" id="cvcno_label">CVC No</label> 
<br> 
<input id="cvcno" type="text" name="cvcno"/> 
<br> 
<label class="dob" for="dateid" id="date_label">Expiry Date<br> 
    <?php $number = range(1,31); 
      $tempholder = range(1,31); 
      $nr=31; 
      echo '<select class="doba" name="dateid" id="dateid">'; 
      echo '<option value="" selected="selected">--Select Date--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 

      echo "<option>".$tempholder[$i]."</option>"; 
      } 
     echo '</select>'; 

      ?> 
</label> 
<label class="dob" for="month" id="month_label">Month 
    <?php $number = range(1,12); 
      $tempholder = range(1,12); 
      $nr=12; 
      echo '<select class="doba" name="month" id="month">'; 
      echo '<option value="" selected="selected">--Select Month--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 

      echo "<option>".$tempholder[$i]."</option>"; 
      } 
     echo '</select>'; 

      ?> 
</label> 
<label class="dob" for="year" id="year_label">Year 
    <?php 
      $tempholder = range(2013,2050); 
      $nr=40; 
      echo ' <select class="doba" name="year" id="year">'; 
      echo '<option value="" selected="selected">--Select Year--</option>'; 
      for ($i=0; $i<$nr; $i++) 
      { 
      echo "<option>".$tempholder[$i]."</option>"; 
      } 
      break; 
     echo '</select>'; 
      ?> 
</label> 
<br> 
<select name="cardtype" id="cardtype"> 
    <option value="" selected="selected">--Card Type--</option> 
    <option value="visa">Visa</option> 
    <option value="master">Master</option> 
    <option value="american">American Express</option> 
</select> 
<input type="submit" value="enter"/>