user2047203
user2047203

Reputation: 27

Populate text field with Value of selected option in Select list

I'm trying to do this with javascript. I have an onchange event for the select list calling a javascript function. The Javascript never gets ran as I have changed the function to just a simple alert and it never pops up. Anything obviously wrong with this?

HTML

select name="nSupervisor" id="iSupervisor" onchange="PopulateUserName()">
        <option value="">---------- </option>
        <option value="test1">Actual Text</option>
    </select>  
<input id="iSupervisorUserName" name="OBKey_WF_Manger_Supervisor_1" type="text" />

JavaScript

function PopulateUsername() {
    var dropdown = document.getElementById("iSupervisor");
    var field = document.getElementByID("iSupervisorName");
    field.value = dropdown.value;
    }

Upvotes: 0

Views: 4954

Answers (2)

Sandeep Raju Prabhakar
Sandeep Raju Prabhakar

Reputation: 20212

This is how to do it,

function PopulateUsername() {
    var sup = document.getElementById("iSupervisor");
    var field = document.getElementById("iSupervisorName");
    field.value = sup.options[sup.selectedIndex].value;
}

Upvotes: 1

Michael Marr
Michael Marr

Reputation: 2099

You've got a few errors on your code there.

First, make sure function PopulateUsername() isn't wrapped by some other function. For now, I assume its not.

Second, JavaScript is case sensitive, so you're calling PopulateUserName() which is NOT PopulateUsername().

Third, you're going to run into an error when you try var field = document.getElementByID(, as it should be getElementById <-- lowercase 'd'.

After that, it should work, and place the value ("test1") into your text box.

JsFiddle example: http://jsfiddle.net/LrCwK/2/

Upvotes: 0

Related Questions