kumar
kumar

Reputation: 1127

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

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?

Upvotes: 7

Views: 65769

Answers (4)

JustSomeGuyInWorld
JustSomeGuyInWorld

Reputation: 75

If you don't want to use

    document.getElementById()

try it:

    var VarName = $('#<%=YouDropDownId.ClientId %>').val();

Upvotes: 0

Buhake Sindi
Buhake Sindi

Reputation: 89169

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.

Upvotes: 12

slugster
slugster

Reputation: 49974

These two lines:

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

are wrong too. If your previous line actually worked:

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

then what you have called textboxId will actually be the textbox control, so you will be doing a getElementById using the control instead of a string identifier.

To follow upon what @anthares said; try this:

var textboxId = '<%=txtCountry.ClientID%>';
alert('My textbox id is: '  + textboxId);

and make sure that you are getting the correct ID for the textbox (remember that it will be munged by ASP.Net, at least make sure you are not getting nothing). Then when you do a document.getElementById you need to check the result before using:

var myTextBox = document.getElementById(textboxId);
if (myTextBox !== null) {
    ...now i can access the properties...
}

Upvotes: 1

anthares
anthares

Reputation: 11213

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!

Upvotes: 4

Related Questions