ASP.NET MVC SelectList Selected Item Wrong After AJAX Post

Question

Having a bit of an issue with a HtmlDropDownList in ASP.NET MVC when using a SelectList.

My issue is this, I have a database with records in for video clips, each record has a property called Type which is either Embedded or Youtube.

I then display these as editable records in a partial view. This works fine, upon initial page load all of the dropdown lists display the correct values for each record.

When I submit a change to a record by editing it and clicking Save on that row, it submits an AJAX form (using Ajax.BeginForm) which updates the entire panel with the entire partial view again - this should then reflect the changes as it re-grabs everything from the database.

However, when the page reloads/is updated, all of the dropdowns revert to the first item in the list as the default selected value... I can verify in the database that the values are still as they should be (i.e. they dont all change to the first value), and I can also confirm via breakpoints that before the view displays, all the values are coming through correctly.

Can anyone shed any light on this?

I am displaying the dropdown list like this:

<%=Html.DropDownList("Type", "Embedded,Youtube".ToSelectList(item.Type), new { style = "width: 100px;"})%>

The "ToSelectList" is just an extension method to create a select list from a comma seperated string, and the parameter is the value to be used as the selected value.

-

SOLUTION

The issue was, I was using "Type" as the name of the DropDownList so all of the dropdown lists had the same ID field, which meant they all took the same value. Instead, I changed them to "{item.ID}.Type" and then in my Controller I simply specified the Prefix for my UpdateModel statement as "{id}.".

var prefix = id.HasValue ? id.Value + "." : "";
UpdateModel(item, prefix, null, new[] { "Featured", "X-Requested-With" });

Darin Dimitrov · Accepted Answer · 2011-08-31 09:19:42Z

0

In the controller action that is serving this page you need to assign a value of Type by reading it from the database:

ViewData["Type"] = ...

And because now I feel dirty for even mentioning ViewData, the correct way of course would be to use view models and strongly typed helpers:

<%= Html.DropDownList(x => x.Type, Model.Types, new { style = "width: 100px;" }) %>

and then inside your controller action simply assign a value of the Type property in your controller action to the correct value.

answered Aug 31, 2011 at 9:19

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

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

5 Comments

Tom Glenn Over a year ago

There is already a value in item.Type for each record. I am passing an IEnumerable<WatchItemViewModel> to the view which is populated from the database.

Darin Dimitrov Over a year ago

@Tom Glenn, where is this value? It should not be in item.Type because in your weakly typed helper you used "Type" as name. If you use the strongly typed version with editor templates you won't have such problems.

Tom Glenn Over a year ago

As far as I'm aware "Type" just refers to the Name of the dropdown list (i.e. <select name="Type">)? I tried your code but there is no overload of Html.DropDownList that accepts a Func as you have written. Also, I can't just pass through a Type field on the Model as I am dealing with multiple items in my Model. (i.e. Model.WatchItems is an IEnumerable)

Tom Glenn Over a year ago

Just to further clarify. My original method WORKS on initial page load. All dropdown lists are populated/selected correctly. The issue only occurs when I save a change and the PartialView is reloaded via Ajax (Even though I can confirm that the data is still pulling through correctly).

Tom Glenn Over a year ago

I've now fixed this. It's because I hadn't specified unique prefixes for each record, so they were all taking the value of the first item as they had the same ID as each other. Solution has been added to original post.

Tom Glenn · Accepted Answer · 2012-11-27 11:06:45Z

0

SOLUTION

The issue was, I was using "Type" as the name of the DropDownList so all of the dropdown lists had the same ID field, which meant they all took the same value. Instead, I changed them to "{item.ID}.Type" and then in my Controller I simply specified the Prefix for my UpdateModel statement as "{id}.".

var prefix = id.HasValue ? id.Value + "." : "";
UpdateModel(item, prefix, null, new[] { "Featured", "X-Requested-With" });

answered Nov 27, 2012 at 11:06

Tom Glenn

2,0424 gold badges18 silver badges26 bronze badges

Collectives™ on Stack Overflow

ASP.NET MVC SelectList Selected Item Wrong After AJAX Post

SOLUTION

2 Answers 2

5 Comments

SOLUTION

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

SOLUTION

2 Answers 2

5 Comments

SOLUTION

Comments

Your Answer

Sign up or log in

Post as a guest

Related