Marimar Marimar - 1 year ago 68
Javascript Question

copy the dropdownlist selected option to text area on mvc view-- JQuery / Javascript

I am trying to copy or put the text option selected on the dropdown list to text area Jquery on MVC View and I select by the text area doesn't show the text.. Any help??

<div class="form-group">
@Html.Label("LocationText", "Location Letter Text ", htmlAttributes: new { @class = "control-label col-md-2" })
<br />
@Html.DropDownList("RemarksId", null, new { id = "RemarksId", @class = "form-control" })
<div class="col-md-10">
</div>
</div>

<div class="form-group">
<div class="col-md-10">
@Html.LabelFor(model => model.Remarks, htmlAttributes: new { @class = "control-label col-md-2" })
</div>
@Html.TextAreaFor(model => model.Remarks, new { @class = "form-control", id = "Remarks", rows = 5, cols = 70 })
@Html.ValidationMessageFor(model => model.Remarks, "", new { @class = "text-danger" })
</div>


JQuery

@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/jscript">
$(function () {
$('#RemarksId').change(function() {
var str= $("#RemarksId option:selected").text();
$('#Remarks').val(str);
});
});
</script>
}

Answer Source

You need to take the value of selected option from dropdown using .text method. please refer below code snippet

$(function () {
      $('#RemarksId').change(function()  {
      var str= $(this).val();
        $('#Remarks').val(str);
      });
    });

And, from the dropdown options change option value="1" to option id="1"

Do this for all options, and the above code will work for you.

Also see demo fiddle here Fiddle

Let me know if it works for you or not.

Thanks

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download