Dropdownlist in MVC 4 with Razor

DropDownList in MVC 4 with Razor

@{
   List<SelectListItem> listItems= new List<SelectListItem>();
   listItems.Add(new SelectListItem
        {
          Text = "Exemplo1",
          Value = "Exemplo1"
        });
   listItems.Add(new SelectListItem
        {
            Text = "Exemplo2",
            Value = "Exemplo2",
            Selected = true
        });
   listItems.Add(new SelectListItem
        {
            Text = "Exemplo3",
            Value = "Exemplo3"
        });
}

@Html.DropDownListFor(model => model.tipo, listItems, "-- Select Status --")

MVC 4 Razor - Creating a dynamic DropDownList

There are a couple ways of doing this without forcing you to store all the possible data items in the model, my preference is to use Javascript/JQuery. Here is an example of a Country/State cascading drop down:

Javascript used to get states when a country is selected:

<script type="text/javascript">
    function AppendUrlParamTokens(url, params) {

        for (var param in params) {
            if (params[param] == null) {
                delete params[param];
            }
        }

        return url + "?" + jQuery.param(params);
    }

    function OnCountriesChange(ddl) {
        jQuery.getJSON(AppendUrlParamTokens('@Url.Action("GetStates", "Data")', { countryId: ddl.options[ddl.selectedIndex].value }), function (result) {
            var target = jQuery('#states_ddl');
            target.empty();
            jQuery(result).each(function() {
                jQuery(document.createElement('option'))
                    .attr('value', this.Value)
                    .text(this.Text)
                    .appendTo(target);
            });
        });
    };
</script>

Country dropdown:

@Html.DropDownListFor(model => model.Country, new SelectList(Model.Countries, "Value", "Text", Model.PreviousCountrySelected), "(Select One)", new { id = "countries_ddl", onchange = "OnCountriesChange(this)" })

State dropdown:

Html.DropDownListFor(model => model.State,
                              Model.States != null
                                       ? new SelectList(Model.States, "Value", "Text", Model.PreviousStateSelected)
                                       : new SelectList(new List<SelectListItem>(), "Value", "Text"),
                              new { id = "states_ddl" })

Controller method to retrieve states:

public ActionResult GetStates(short? countryId)
{
    if (!countryId.HasValue)
    {
        return Json(new List<object>(), JsonRequestBehavior.AllowGet);
    }

    var data = GetAllStatesForCountry(countryId.Value).Select(o => new { Text = o.StateName, Value = o.StateId });

    return Json(data, JsonRequestBehavior.AllowGet);
}

The idea is that on selection of dropdown 1 you use ajax to go retrieve your second dropdown's value.

Edit: Forgot to include utility method for constructing urls

How to Implement Dependent Dropdownlist in MVC4 Razor

This might help you.
http://code.msdn.microsoft.com/Cascading-DropDownList-in-833683f9

Try to implement like example given in that tutorial.

How to generate dropdownlist in asp.net MVC razor

Use it like this

@Html.DropDownList("Direction", new SelectList(listItems , "Value" , "Text"),new {onchange = "getAlldata()"})

How to fill dropdownlist for MVC4 razor views (C#)

Add a SelectList to your ViewBag in the Controller:

ViewBag.ProfileId = new SelectList(db.UserProfiles, "Id", "Username");

then add this in your View:

@Html.DropDownList("ProfileId", String.Empty)

Moreover you should have used "model" instead of "Model" in your lambda expression.

---

Related Topics