Pass dropdownlist value to textbox using javascript

Question

I have a button which when clicked should just pass the selected value from dropdownlist to a textbox.Here is the code :

    <td>
    <script type="text/javascript">
    function calculateCity() {

     var city = document.getElementById('<%= ddlCity.ClientID%>');
     txtCity0.value = city.options[city.selectedIndex].value;
                }
     </script>

     <asp:TextBox ID="txtCity0" runat="server" Width="260px"></asp:TextBox>
     <asp:DropDownList ID="ddlCity" runat="server">
     <asp:ListItem Value="1">Mumbai</asp:ListItem>
     <asp:ListItem Value="2">Pune</asp:ListItem>
     </asp:DropDownList>
     <input id="btnCity" onclick="calculateCity();" type="button" value="Calculate City" /></td>

This code just doesnt do anything.Any help will be appreciated.Thank You

This is totally unrelated to your question, but out of curiosity. Why are you keeping the <script> tag inside <td>? Is there any special requirement? I'd like to know about that. — wonderbell
– wonderbell, Commented Mar 21, 2015 at 18:20
No logic as such.I thought the script runs inside the same td where i am using it? — RelatedRhymes
– RelatedRhymes, Commented Mar 21, 2015 at 18:24
So, just to let you know, when you call document.AnyXYZfunction(), it works on the whole document. It is better to keep only one script tag for whole page, and keep it in the head. If you are working on a Content page then keep it on top or bottom of the page. — wonderbell
– wonderbell, Commented Mar 21, 2015 at 18:32

Tim · Accepted Answer · 2015-03-21 18:14:17Z

1

You are finding the drop down correctly, but then not finding the text box and simply trying to use it.

You need a similar getElementById line for the text box

answered Mar 21, 2015 at 18:14

Tim

2,9321 gold badge17 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rahul Singh · Accepted Answer · 2015-03-21 18:20:45Z

0

Try this:-

function calculateCity() {
    var city = document.getElementById('<%= ddlCity.ClientID%>');
    document.getElementById('<%= txtCity0.ClientID%>').value = 
                                                city.options[city.selectedIndex].value;
 }

Or if you can use jQuery, then you can do this:-

$("#<%= btnCity.ClientID %>").click(function() {
    $('#<%= txtCity0.ClientID %>').val($('#<%= ddlCity.ClientID %>').val());
});

edited Mar 21, 2015 at 18:20

answered Mar 21, 2015 at 18:14

Rahul Singh

21.8k6 gold badges43 silver badges61 bronze badges

Collectives™ on Stack Overflow

Pass dropdownlist value to textbox using javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related