c# - Populate Telerik Drop-down list based on what is selected in other list

Question

I have a Telerik Drop-down list which I want to populate based on what is selected for one other Drop-down list.

For eg:

If I select "Numbers" for DDL1 then I wan to display 1 through 10 in DDL2, If I select "Alphabets" for DDL1 then I want to display a through z in DDL2.

Here is how I populate my DDL1:

    <%= Html.Telerik().DropDownList().Name("Type")
    .HtmlAttributes(new { @id = "Type" })
    .Items(items => {
        items.Add().Text("").Value("");
        items.Add().Text("Numbers").Value("Numbers");
        items.Add().Text("Alphabets").Value("Alphabets");
            })%>    

Answer 1

You can do it like this:

View:

<p>
  <%: Html.Label("Type") %>
  <%: Html.Telerik().DropDownList().Name("Type")
    .HtmlAttributes(new { id = "type" })
    .Items(items => {
        items.Add().Text("").Value("");
        items.Add().Text("Numbers").Value("1");
        items.Add().Text("Alphabets").Value("2");
    })
    .CascadeTo("Values")
  %>    
</p>
<p>
  <%: Html.Label("Values" %>
  <%: Html.Telerik().DropDownList().Name("Values")
    .HtmlAttributes(new { id = "values" }) 
    .DataBinding(b => b.Ajax().Select("GetDropDownValues", "Home"))
  %>       
</p>

Controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public JsonResult GetDropDownValues(int? type)
    {
        var values = new List<string>();
        switch (type)
        {
            case 1:
                values = Enumerable.Range(1, 10).Select(n => n.ToString()).ToList();
                break;
            case 2:
                values = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".ToCharArray().Select(c => c.ToString()).ToList();
                break;
        }

        return Json(new SelectList(values));
    }
}