How to get selected value from dropdownlist in asp.net using Javascript?

Question

I am populating country dropdownlist from a database. I need to select a value from dropdown list and assign it to textbox by using Javascript.

Code:

var textboxId = document.getElementById("txtCountry");
var dropdownListId =document.getElementById("ddlLocation"); 

var e = document.getElementById("ddlLocation"); 
var strUser = e.options[e.selectedIndex].value;

document.getElementById(textboxId).value = strUser;    
document.getElementById(textboxId).focus(); 

by doing this I am getting error. Any solutions?

Answer 1

Your code is wrong, Look at where I've made the changes to the same code:

var textboxId = document.getElementById("txtCountry");
var e = document.getElementById("ddlLocation"); 
var strUser = e.options[e.selectedIndex].value;
textboxId.value = strUser;    
textboxId.focus(); 

What you did, is you selected your textbox and JS returned you a DOM element of that text box and you wanted to populate it by passing the DOM of the textBox inside the getElementById() function.

Here is where it broke:

document.getElementById(textboxId).value = strUser;

To use getElementById() method, you pass a string value of the id of an element.

Hope this helps.

Answer 2

Try with:

document.getElementById('<%=txtCountry.ClientID%>').value

or

var textBox = document.getElementById('<%=txtCountry.ClientID%>');
textBox.value = strUser;

That's because the ids of the html elements in the generated documents doesn't match with the id that you have assigned in your code. To get the id assigned to your control in the html, you can use the ClientID property of your dropdown.

Another problem is that you assign yourhtml element to variable and then use getElementById function which is not valid call.

This is changed in ASP.NET 4, that is about to be released.

Hope that helps!