Wie ändert man ein Feld basierend auf der Benutzerauswahl in einer HTML-Auswahl?

Question

Ich habe eine Auswahlliste Variablen aus einer Abfrage

<tr> 
    <td>County Name:</td> 
    <td> 
     <select name="countyName" onchange="countyID.value = countyName.value"> 
       <option>Select a County</option> 
     <cfloop query = "getCounties"> 
     <option value="#countyName#" >#countyName#&nbsp;&nbsp;&nbsp;#countyID#</option> 
     </cfloop> 
    </select> 
    </td> 
</tr> 

Wie kann ich die Landkreis-ID-Feld enthält, bevölkern?

<tr> 
    <td>County ID:</td> 
    <td><input type="Text" name="countyID"> 
    </td> 
</tr> 

Ich habe noch nie jQuery verwendet. Gibt es eine Möglichkeit, nur JavaScript zu verwenden? Wie Sie sehen können, habe ich versucht, JavaScript, aber ich kann nur füllen countyID mit der countyName und ich brauche es mit countyID bestückt.

Answer 1

brechen sie in eine Funktion aus, dies für Sie arbeiten sollten: Live Example

<table> 
    <tbody> 
     <tr> <td>County ID:</td> <td><input id="countyId" type="Text" name="countyID"> </td> </tr> 
     <tr> <td>County Name:</td> 

      <td> 
       <select name="countyName" onchange="update(this)"> 
        <option>Select a County</option> 
        <option value="1234">asdf</option> 
        <option value="4321">asdf2</option> 
       </select> 
      </td> 
     </tr> 
    </tbody> 
</table> 
<script> 
    function update(elem) { 
    document.getElementById('countyID').value = elem.value; 
    } 
</script> 

---

Oder kurz ändern, nur

dieses:

<select name="countyName" onchange="countyID.value = countyName.value"> 

dazu und es sollte funktionieren

<select name="countyName" onchange="document.getElementById('countyId').value = this.value"> 

Sie benötigen eine DOM-Elemente über document.getElementById() und nicht nur ihre id allein

Another example here

Answer 2

Nur aus Neugier verweisen, warum verwenden Sie #countyName# als die Werte für die Optionen? Was ist, wenn der Landkreis (fälschlicherweise oder nicht) ein Zitat oder etwas anderes hat, das mit Ihrem HTML-Code verschraubt ist?

Warum würden Sie nicht tun:

<select name="countyName" onchange="countyID.value = this.value"> 
    <option value="#countyID#">#countyName#</option> 
</select>