HTML - Inserisci il contenuto del tag SELECT in INPUT type = "text"

Question

Ho un modulo in una pagina Web in cui desidero inserire l'elemento selezionato in un elenco a discesa in una casella di test. Il codice che ho fino ad ora è la seguente:

  <form action = ""> 
       <select name = "Cities"> 
        <option value="----">--Select--</option> 
        <option value="roma">Roma</option> 
        <option value="torino">Torino</option> 
        <option value="milan">Milan</option> 
       </select> 
       <br/> 
       <br/> 
       <input type="button" value="Test"> 
       <input type="text" name="SelectedCity" value="" /> 
      </form> 

Penso di aver bisogno di usare JavaScript .... ma di aiuto? :-)

grazie

Answer 1

È possibile aggiungere JavaScript direttamente nel pulsante:

<input type="button" onclick=" 
    var s = this.form.elements['Cities']; 
    this.form.elements['SelectedCity'].value = 
     s.options[s.selectedIndex].textContent"> 

Answer 2

<script type="text/javascript"> 
    function OnDropDownChange(dropDown) { 
     var selectedValue = dropDown.options[dropDown.selectedIndex].value; 
     document.getElementById("txtSelectedCity").value = selectedValue; 
    } 
</script> 

     <form action = ""> 
      <select name = "Cities" onChange="OnDropDownChange(this);"> 
       <option value="----">--Select--</option> 
       <option value="roma">Roma</option> 
       <option value="torino">Torino</option> 
       <option value="milan">Milan</option> 
      </select> 
      <br/> 
      <br/> 
      <input type="button" value="Test"> 
      <input type="text" id="txtSelectedCity" name="SelectedCity" value="" /> 
     </form> 

Answer 3

In realtà non è necessario alcun JS di farlo, semplicemente HTML può farlo per tu come segue:

<form action="a.php" method="post"> 
    <select name = "Car"> 
    <option value="BMW">BMW</option> 
    <option value="AUDI">AUDI</option> 
    </select> 
    <input type="submit" value="Submit"> 
</form>