i want to know how to populate dropdownlist based on another dropdown selection

For example,

I have two dropdownlist named drpState,drpCity

When User selects drpState value

drpCity Should Be populated based on selection

I Want To Perform this functionality in asp.net mvc 4.0..

see the following:

http://www.c-sharpcorner.com/UploadFile/4d9083/creating-simple-cascading-dropdownlist-in-mvc-4-using-razor/

public partial class CountryDropdowns : System.Web.UI.Page
{
    string strcon = ConfigurationManager.ConnectionStrings["sqlconn"].ConnectionString;
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
BindContrydropdown();
}
 
}
/// <summary>
/// Bind COuntrydropdown
/// </summary>
protected void BindContrydropdown()
{
//conenction path for database
SqlConnection con = new SqlConnection(strcon);
con.Open();
SqlCommand cmd = new SqlCommand("select * from Counrty", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
ddlCountry.DataSource = ds;
ddlCountry.DataTextField = "Country";
ddlCountry.DataValueField = "Id";
ddlCountry.DataBind();
ddlCountry.Items.Insert(0, new ListItem("--Select--", "0"));
ddlCity.Items.Insert(0, new ListItem("--Select--", "0"));
ddlState.Items.Insert(0, new ListItem("--Select--", "0"));
 
}
/// <summary>
/// Bind State Dropdown Based on CountryID
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void ddlCountry_SelectedIndexChanged(object sender, EventArgs e)
{
int Id = Convert.ToInt32(ddlCountry.SelectedValue);
SqlConnection con = new SqlConnection(strcon);
con.Open();
SqlCommand cmd = new SqlCommand("select * from City where Id="+Id, con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
ddlCity.DataSource = ds;
ddlCity.DataTextField = "City";
ddlCity.DataValueField = "CityId";
ddlCity.DataBind();
ddlCity.Items.Insert(0, new ListItem("--Select--", "0"));
if(ddlCity.SelectedValue=="0")
{
ddlState.Items.Clear();
ddlState.Items.Insert(0, new ListItem("--Select--", "0"));
}
 
}
/// <summary>
/// Bind Region dropdown based on Re
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void ddlCity_SelectedIndexChanged(object sender, EventArgs e)
{
int CityId = Convert.ToInt32(ddlCity.SelectedValue);
SqlConnection con = new SqlConnection(strcon);
con.Open();
SqlCommand cmd = new SqlCommand("select * from State where CityId=" + CityId, con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
ddlState.DataSource = ds;
ddlState.DataTextField = "State";
ddlState.DataValueField = "StateId";
ddlState.DataBind();
ddlState.Items.Insert(0, new ListItem("--Select--", "0"));
}
}

pls refer this url 
http://www.codeproject.com/Questions/578240/CascadingplusDropplusdownpluslistplusinplusasp-net

Suresh Sivalingam

He wants to do it in MVC4. Your posted code is for Web Forms.

Refer below links

http://aspdotnet-kishore.blogspot.in/2013/10/how-to-create-cascading-dropdownlist-in.html 

http://aspdotnet-kishore.blogspot.in/2013/10/json-create-cascading-dropdownlist-from.html 

Hi VivekBheda,

Thanks for your post.

 According to your description,

VivekBheda

how to populate dropdownlist based on another dropdown selection

I did a simple sample,you can refer to the following code snippet:

controller:

 public ActionResult demo5()
        {

            List<string> items = new List<string>();
            items.Add("Please select");
            items.Add("USA");
            items.Add("UK");
            items.Add("India");
            SelectList countries = new SelectList(items);
            ViewData["countries"] = countries;
            return View();
        }
        public JsonResult GetStates(string country)
        {
            List<string> states = new List<string>();
            switch (country)
            {
                case "USA":
                    states.Add("California");
                    states.Add("Florida");
                    states.Add("Ohio");
                    break;
                case "UK":
                    //add UK states here
                    states.Add("ss");
                    break;
                case "India":
                    //add India states hete
                    states.Add("sa");
                    break;
            }
            return Json(states);
        }

view:

@{
    ViewBag.Title = "demo5";
}
<script>
    $(document).ready(function () {
        $("#state").prop("disabled", true);
        $("#country").change(function () {
            if ($("#country").val() != "Please select") {
                var options = {};
                options.url = "/home/getstates";
                options.type = "POST";
                options.data = JSON.stringify({ country: $("#country").val() });
                options.dataType = "json";
                options.contentType = "application/json";
                options.success = function (states) {
                    $("#state").empty();
                    for (var i = 0; i < states.length; i++) {
                        $("#state").append("<option>" + states[i] + "</option>");
                    }
                    $("#state").prop("disabled", false);
                };
                options.error = function () { alert("Error retrieving states!"); };
                $.ajax(options);
            }
            else {
                $("#state").empty();
                $("#state").prop("disabled", true);
            }
        });
    });
</script>

<h2>demo5</h2>
@using(Html.BeginForm("ProcessForm","Home",FormMethod.Post)){ 
<div>Select Country :</div>
@Html.DropDownList("country", ViewData["countries"] as SelectList)
<br /><br />
<div>Select States :</div>
<select id="state"></select>
<br /><br />
<input type="submit" value="Submit" />
}

Like this:

More information:

#Creating Cascading DropDownLists using ASP.NET MVC 4 and jQuery

http://www.bipinjoshi.net/articles/b58fde6b-415e-454d-985b-d5dc4ad2fca8.aspx

Hope this can be helpful.

Best Regards,

Eileen