CODEWITHSUNDEEP
c#asp.netdrop-down-menudropdownhtml-select
newbie
newbie

Reputation: 1217

How can I dynamically add elements to a dropdownlist with Razor/MVC 5

I need to change the following dropdownlist in my asp.net application, now I have to add values depending in the type of user, which wasn't required before. The following code works fine, but clearly I'm hardcoding the input of the elements.

@Html.DropDownListFor(
    model => model.Vote, 
    new SelectList(
        new List<SelectListItem> {
            new SelectListItem { Selected=true, Text = "Randy", Value = "1" }, 
            new SelectListItem { Selected=false, Text = "Richard", Value = "2" },
            new SelectListItem { Selected=false, Text = "Bubbles", Value = "3" }, 
            new SelectListItem { Selected=false, Text = "Julian", Value = "4" } 
        }, 
        "Value", 
        "Text"
    ), 
    htmlAttributes: new { @class = "form-control" }
)

I'm receiving the list from the controller, and I can loop through it, but I'm not able to use this information as SelectListItems. Obvioulsy, the first, and the last SelectListItems are special, the first one, has the property Selected set to true, while the others are set to false, that way the first one is selected by default. The last one, on the other hand, doesn't have a comma before it's closing tag } which the previous ones do, so this is how I'm looping.

@for (var i = 0; i < candidatos.Count(); i++)
{
    if (i == 0)
    {
        <h4>"First candidate:" + candidatos.ElementAt(i)</h4>
    }
    else if (i < candidatos.Count() - 1)
    {
        <h4>"Not first nor last:" + candidatos.ElementAt(i)</h4>
    }
    else
    {
        <h4>"Last candidate:" + candidatos.ElementAt(i)</h4>
    }
}

So this is output correctly, but I really need help with the syntax, I have been trying hard to combine this iteration with the syntax that I hardcoded and properly shows elements as items in a dropdownlist, but I can't figure out how to, yet.

This is how I tried to combine both stuff, but I'm getting errors.

@Html.DropDownListFor(model => model.Voto, new SelectList(new List<SelectListItem> { 
    for (var i = 0; i < candidatos.Count(); i++)
{
    if (i == 0)
    {
        new SelectListItem { Selected = true, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() },
    }
    else if (i < candidatos.Count() - 1)
    {
        { new SelectListItem { Selected = false, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() },
    }
    else
    {
        { new SelectListItem { Selected = false, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() } }, "Value", "Text" ),
            htmlAttributes: new { @class = "form-control" })
    }
}

browser yells at me saying the expression needs a closing } after

@Html.DropDownListFor(model => model.Voto, new SelectList(new List<SelectListItem> {

I think it doesn't realize I'm providing the corresponding closing tags, and missing elements using the for loop, but obviously, because I'm doing it wrong.

Upvotes: 1

Views: 3385

Answers (1)

claudiom248
claudiom248

Reputation: 346

The first thing to do is create a new variable that will store our SelectListItem. Then we will iterate on our "candidatos" and we will add a new item with properties that will be set taking into consideration your logic.

@{ 
    var selectListItems = new List<SelectListItem>();

    for (int i = 0; i < candidatos.Count(); i++)
    {
        if (i == 0)
        {
            selectListItems.Add(new SelectListItem { Selected = true, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() });
        }
        else if (i < candidatos.Count() - 1)
        {
             selectListItems.Add(new SelectListItem { Selected = false, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() });
        }
        else
        {
             selectListItems.Add(new SelectListItem { Selected = false, Text = candidatos.ElementAt(i + 1), Value = (i + 2).ToString() });
        }
    }
}

At the end, you will pass the new generated list as second parameter to the DropDownListFor method of the Html class.

@Html.DropDownListFor(m => m.Voto, selectListItems, htmlAttributes: new { @class = "form-control" });

I hope my solution will suit your needs. Let me know if you have any questions.

Upvotes: 1

Related Questions