Mismatch of text in drop down list and textbox text

Question

I have drop down list and a text box .

I am selecting an item from dropdownlist and on selection the selected text from dropdownlist is shown in textbox.

I am facing a problem here as below :

One of the text populated in dropdownlist is :

SUNROOF, POWER, TILT-SLIDING, ELECTRIC with express-open and wind deflector -Includes (CJ2) Air conditioning, dual-zone, automatic.  -Includes (ZM9) Universal Transmitter)

But when this is selected and the same text shown in textbox, the text is becoming as below .. ie losing a space, and this is causing a problem.

SUNROOF, POWER, TILT-SLIDING, ELECTRIC with express-open and wind deflector -Includes (CJ2) Air conditioning, dual-zone, automatic. -Includes (ZM9) Universal Transmitter)

NOTE : "automatic.[2space here]-Includes" in dropdownlist and "automatic.[1 space here]-Includes" in textbox. ie one space less.

Texts are loaded to the drop downlist like below :

ddlEngine.Items.Add(new ListItem(Engine[i][0], Engine[i][1]));

Here Engine[i][0] = TEXT

Engine[i][1] = Integer value for diff purpose..

And on change of dropdownlist value...the text is copied to the textbox as below :

document.getElementById("engineText").value = document.getElementById("ddlEngine").options[document.getElementById("ddlEngine").selectedIndex].text;

I need both of these values to be same. Any idea why is this happening so??? And how can I get it of this behaviour.

Answer 1

Just want to confirm whether both of your controls are asp.net controls?

I just copied your code and executed. It is working fine for me.

<asp:DropDownList ID="DropDownList1" runat="server" Width="1108px" AutoPostBack="True"
            onchange="changeCursor()" Height="26px">
     <asp:ListItem>SUNROOF, POWER, TILT-SLIDING, ELECTRIC with express-open and wind deflector -Includes (CJ2) Air conditioning, dual-zone, automatic.  -Includes (ZM9) Universal Transmitter)</asp:ListItem>
     <asp:ListItem>select</asp:ListItem>
</asp:DropDownList>

<asp:TextBox ID="TextBox1" runat="server" Width="1103px"></asp:TextBox>

Following is the javascript function to show selected value-

<script language="javascript" type="text/javascript">
    function changeCursor() {
        document.getElementById("TextBox1").value = document.getElementById("DropDownList1").options[document.getElementById("DropDownList1").selectedIndex].text;
    }
</script>

are you using the same way????

Answer 2

I just tried it and after this in codebehind:

ddl1.Items.Add("12        34")

the text appeared "12 34" in the dropdownlist on the page.

If it's feasible, you could convert all multiple spaces to a single space before adding the strings to the dropdownlist.

Another approach would be to use ddlEngine.SelectedIndex to copy the original, something like this:

TextBox1.Text = Engine[ddlEngine.SelectedIndex][0]