Preencher um DropDown a partir da seleção de outro DropDown

Question

Galera, tudo certo?

Como faço para preencher um dropdown a partir da seleção de outro dropdown?

Por exemplo, seleciono um estado em um dropdown, e dinamicamente, o dropdown de cidade é preenchido com as cidades daquele estado.

Meu problema maior é como fazer esse dinamismo usando C# MVC Framework 4.0, HTML5 e JavaScrip.

Valeu. Um abraço!

Answer 1

Olá Felipe,

Aqui tem um exemplo muito bom para o que quer: http://www.c-sharpcorner.com/uploadfile/4d9083/creating-simple-cascading-dropdownlist-in-mvc-4-using-razor/

E aqui também: http://www.c-sharpcorner.com/UploadFile/sourabh_mishra1/cascading-dropdownlist-in-Asp-Net-mvc/

Valeu!

---

Se a resposta for relevante ou tenha resolvido seu problema, marque como útil/resposta!

André Secco
Microsoft MSP & MSDN Tech Advisor
Blog: http://andresecco.com.br
GitHub: http://github.com/andreluizsecco
Twitter: @andre_secco

Answer 2

Olá André, tudo certo?

Muito obrigado pela ajuda! Estou estudando ambos os links e vendo como encaixar no que preciso.

Abraço!

Answer 3

André,

Estou com o seguinte código e não estou conseguindo retornar a lista do controller para a view. Teria alguma sugestão?

VIEW

        $("#StatePar").change(function () {
            var idStatePar = $("#StatePar").val();
            //var idCountry = $("#Country").val();
            $.post("@Url.Action(MVC.Escritorio.Clientes.VerificarCidadeDifBr())", { codCitySel: idStatePar })
                .done(function (data) {
                    alert(data.length);
                })
                .error(function (ex) {
                    alert('Vc está fazendo alguma ca****, jovem rapaz!' + ex);
                })
        });

CONTROLLER

        [HttpPost]
        public virtual ActionResult VerificarCidadeDifBr(int codCitySel)
        {
            var xpto = new List<TCity>();

            xpto = TCity.ListAllCities().Where(x => x.State.Id == codCitySel).OrderBy(x => x.Name).ToList(); //.ToSelectList(x => x.Id, x => x.Name);

            return Json(xpto, JsonRequestBehavior.AllowGet);
        }

Answer 4

Eu tentaria trocar na view: o "done" por "success"

E no controller tente deixá-lo assim:

        [HttpPost]
        public virtual JsonResult VerificarCidadeDifBr(int codCitySel)
        {
            var xpto = new List<TCity>();

            xpto = TCity.ListAllCities().Where(x => x.State.Id == codCitySel).OrderBy(x => x.Name).ToList();

            return Json(new { xpto = xpto });
        }

Veja se resolve.

---

Se a resposta for relevante ou tenha resolvido seu problema, marque como útil/resposta!

André Secco
Microsoft MSP & MSDN Tech Advisor
Blog: http://andresecco.com.br
GitHub: http://github.com/andreluizsecco
Twitter: @andre_secco

Answer 5

Muito obrigado pela ajuda :).

Fiz as alterações que sugeriu e quando seleciono qualquer estado ele gera o alert do error com a mensagem "Erro [object Object]". O que será que pode ser? Teria mais alguma sugestão ou algum outro artigo para eu verificar?

JavaScript View

        $("#StatePar").change(function () {
            var idStatePar = $("#StatePar").val();
            $.post("@Url.Action(MVC.Escritorio.Clientes.VerificarCidadeDifBr())", { codCitySel: idStatePar })
                .success(function (data) {
                    alert(data.length);
                })
                .error(function (ex) {
                    alert('Erro ' + ex);
                })
        });

Controller

        [HttpPost]
        public virtual JsonResult VerificarCidadeDifBr(int codCitySel)
        {
            var xpto = new List<TCity>();

            xpto = TCity.ListAllCities().Where(x => x.State.Id == codCitySel).OrderBy(x => x.Name).ToList(); //.ToSelectList(x => x.Id, x => x.Name);

            return Json(new { xpto = xpto });
        }

Mais uma vez, muito obrigado pela ajuda!