Update data in textboxfor fields using a selected object in a dropdownlist

Question

In a view where my user can create a new item, he will have to select an item from a dropdownlist like this:

@Html.DropDownListFor(model => model.m_CustomerId, ViewBag.ListCustomers as SelectList, "--- Select Customer ---", new  {@class = "CustomerInfo" })

When the selection is made, there are fields in the current view that would name to be updated with the selection made. Those fields are like those:

Item Name: @Html.TextBoxFor(model => model.m_ItemName, new { @disabled = "disabled" }) @Html.ValidationMessageFor(model => model.m_ItemName)<br/>
        Item Date: <span style="font-weight: bold">@Html.DisplayFor(model => model.m_ItemDate)</span> @Html.ValidationMessageFor(model => model.m_ItemDate)<br/>

I've read a few things like maybe using JQuery or Java, but I'm honestly cluesless and I don't know these languages. How could I do this? I do not mind trying out languages, scripts or anything else, but I'm rather a newbie in MVC app and this is puzzling me. Thanks a lot!

Note that I don't mind trying out or working around with any languages — hsim
– hsim, Commented Mar 4, 2013 at 20:19
Oh, and you really need to learn javascript. It is essential if you doing web development. Here's a decent resource to get you going. — Forty-Two
– Forty-Two, Commented Mar 4, 2013 at 20:32
Haha, thanks for the tutorial @Forty-Two, you are right. I will plunder this site very soon! — hsim
– hsim, Commented Mar 4, 2013 at 20:37

Mike Perrenoud · Accepted Answer · 2013-03-04 20:29:01Z

1

So what you might want to do is download and install jQuery via NuGet Package Manager. Once you've gotten that installed then we can extend the controls. You could extend the DropDownListFor by adding some attributes.

@Html.DropDownListFor(model => model.m_CustomerId,
    ViewBag.ListCustomers as SelectList,
    "--- Select Customer ---",
    new
    {
        @class = "CustomerInfo",
        onchange = "function() { $('m_ItemName').val($(this).text()); }"
    }
)

answered Mar 4, 2013 at 20:29

Mike Perrenoud

68.1k32 gold badges167 silver badges238 bronze badges

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

2 Comments

smvlad Over a year ago

Just keep in mind that model is your server side object and selection in the dropdown happens on the front end. Model values are rendered on page load. If you need to do anything more complicated than displaying selected drop down value (like Model.CustomerName and Model.CustomerPhone) you will either need to create javascript object to hold complete list of customers or have another server call to load customer properties based on selected value.

hsim Over a year ago

Oh. I see. So that is more complicated that I want. @smvlad I do not mind trying those out. In theory, the dropdownlistfor is holding those values. I'm wondering if it would not be easier to figure out with a partial view?

Collectives™ on Stack Overflow

Update data in textboxfor fields using a selected object in a dropdownlist

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related