MVC- drop down values not binding for all the rows in a table

Question

The model:

public class EdituserModel  : IEnumerable<EdituserModel>
{
    public int UserID { get; set; }
    public string Status { get; set; }
    public IEnumerator<EdituserModel> GetEnumerator()
    {
        return ((IEnumerable<EdituserModel>)editUser).GetEnumerator();
    }
    IEnumerator IEnumerable.GetEnumerator()
    {
        return ((IEnumerable<EdituserModel>)editUser).GetEnumerator();
    }
}

The View:

<table id="tbltbl_usertable" class="tableasd" cellpadding="0" cellspacing="0">
    <tr>
        <th style="width:115px;text-align: center; ">User Id</th>
        <th style="width:100px;text-align: center;">Status</th>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    @foreach (var user in Model)
    {
        <tr>
            <td class="UserID" style="text-align: center; ">
                <span style="text-align: center;">@user.UserID</span>
            </td>
            <td class="Status" style="text-align: center;">                     
                <select id="SelectedStatusId" name="SelectedStatusId" value="@user.Status" >
                    <option value="A"  selected="selected">Admin</option>
                    <option value="U">Dashboard user</option>
                </select>         
            </td>
        </tr>
    }
</table>

From the above code, the UserID is being displayed properly (8 rows for 8 users). But only one drop down is being displayed for the first row and not the subsequent rows. Is there something I'm missing?

What is the model for the View? Since you're looping through `Model`, I'm assuming it is `IEnumerbale`. So why is there a `List` property inside `EdituserModel`? — adiga, Sep 13 '17 at 17:29
@adiga. Yes it is the EditUserModel. I have removed the list from the question. Sorry for the confusion. — TheChosenOne94, Sep 13 '17 at 18:01
isn't the model `IEnumerbale`? You're looping through `Model` — adiga, Sep 13 '17 at 18:02
Could it be related to the fact that you've inappropriately given each `select` the same `id` - which is not legal HTML? Try giving them unique `id` attributes and see if it makes a difference. — stephen.vakil, Sep 13 '17 at 18:26
@stephen.vakil. If Im binding the rows from database and the number of rows change, how can i assign unique ids? — TheChosenOne94, Sep 13 '17 at 18:27

adiga · Accepted Answer · 2017-09-14T04:42:43.640

The way you're binding to the select is wrong. You can't set an option in the dropdown by setting the value attribute of select (try it). Besides, you're setting selected="selected" on the first option. I'm guessing that is selected in all the dropdowns.

"Only one drop down is being displayed for the first row and not the subsequent rows":

I don't know how this is possible. I have tested this in my system and it wasn't reproducible.

So, how to bind your value to the dropdown? You should use MVC's DropdownListFor HTML Helper.

@for (var i = 0; i < Model.Count(); i++)
{
    <tr>
        <td class="UserID" style="text-align: center; ">
            <span style="text-align: center;">Model.editUser[i].UserID</span>
        </td>

        <td class="Status" style="text-align: center;">
            @Html.DropDownListFor(m => Model.editUser[i].Status, new SelectList(new[] {
                new { Text = "Admin", Value = "A" },
                new { Text = "Dashboard user", Value = "U" },
            }, "Value", "Text", Model.editUser[i].Status))
        </td>
    </tr>
}

You should use a for loop instead of foreach whenever you're looping and creating form elements in MVC (Why though?). This generates appropriate name attribute which are important when submitting forms.

(We usually get the SelectListItems in a ViewBag and bind. But there is an issue in MVC with DropDownList helper when we are looping)

"BUT I DONT CARE ABOUT GIVING PROPER NAMES TO FORM ELEMENTS OR DROPDOWNLISTFOR OR ANY OF THAT STUFF. I JUST WANT TO BIND MY DROPDOWN OKAY?":

Then:

@for (var i = 0; i < Model.Count(); i++)
{
    <tr>
        <td class="UserID" style="text-align: center; ">
            <span style="text-align: center;">@Model.editUser[i].UserID</span>
        </td>

        <td class="Status" style="text-align: center;">
            <select id="SelectedStatusId" name="SelectedStatusId">
                <option value="A" @(Model.editUser[i].Status == "A" ? "selected" : "" )>Admin</option>
                <option value="U" @(Model.editUser[i].Status =="U" ? "selected" : "" )>Dashboard user</option>
            </select>
        </td>

    </tr>
}

UPDATE: I saw your update now reagarding the Enumerator. See, this is why I asked you post all the relevant code. You said your model for the page was IEnumerable<EdituserModel>. My asnwer would still work. Replace all the Model[i] with Model.editUser[i] (otherwise you'd have implement IList as well)

MVC- drop down values not binding for all the rows in a table

1 Answers1