Eduard Eduard - 4 days ago 6
jQuery Question

Populate Textbox with multiple values from DropDownList

I have:

@Html.EnumDropDownListFor(model => model.City, htmlAttributes: new { @class = "form-control", @id = "dropdownID" })


I want to populate a
Textbox
from this
DropDownList
with multiple values separated by comma. I tried two things but I am kinda stuck right now.

1.

$('#dropdownID').on('change', function () {
$("#textbox").val($(this).find("option:selected").text());
})


This is sending one text value to the Textbox but how I make it with multiple values?

2

var mytextbox = document.getElementById('textbox');
var mydropdown = document.getElementById('dropdownID');

mydropdown.onchange = function () {
mytextbox.value = mytextbox.value + this.value;
}




The second one is giving me in the
Textbox
every value I select but not the text, how I can make it to diplay the text instead the value?

I am not that good with jquery.
Thank you very much!

Answer

You're close with your first solution. You just need to pass the .val() function its existing value as well, like this:

    $("#textbox").val($('#textbox').val() + ' ' +
        $(this).find("option:selected").text());
Comments