Array
(
)

Ajax com jquery e combos

Pjava
   - 26 jun 2013

Como eu faço para carregar uma combo(select) de estados e cidades com Ajax e Jquery.

Pjava
   - 27 jun 2013

Essa é meu método de busca no BD

public ListItem GetEstado()
{
List<tbEstado> lista = new List<tbEstado>();
ListItem retorno = new ListItem();

var estados = (from p in lista
select new
{
p.Estado,
p.id
});
foreach(var e in estados)
{
retorno = (new ListItem(e.Estado, e.id.ToString()));
}
return retorno;
}

public ListItem GetCidade()
{
List<tbEstado> estado = new List<tbEstado>();
List<tbCidade> cidade = new List<tbCidade>();
ListItem retorno = new ListItem();

var cidades = (from c in cidade
join e in estado on c.tbEstado_id equals (e.id)
select new
{
c.Cidade,
c.id
});
foreach (var e in cidades)
{
retorno = (new ListItem(e.Cidade, e.id.ToString()));
}
return retorno;
}

esse é meu controller

[HttpPost]
public ActionResult pegaEstado()
{
ViewData["Est"] = _estado.GetEstado();
return View();
}

[HttpPost]
public ActionResult pegaCidade()
{
ViewData["Cid"] = _estado.GetCidade();
return View();
}

[HttpPost]
public JsonResult GetJsonEstado()
{
return Json(pegaEstado());
}
Agora, na minha View é que a bagaça não funfa. Tá osso.

Pjava
   - 28 jun 2013

Refiz dessa forma e consigo preencher a combo de Estados, mas falta a de cidades. No meu controller tenho isso:
private IList<tbCidade> GetCidades(int id)
{
return tp.Cidade.Where(c => c.tbEstado_id == id).ToList();
}

[AcceptVerbs(HttpVerbs.Get)]
public JsonResult CarregaCidade(string id)
{
var cidadeList = this.GetCidades(Convert.ToInt32(id));
var cidadeData = cidadeList.Select(c => new SelectListItem()
{
Text = c.Cidade,
Value = c.tbEstado_id.ToString(),

});

return Json(cidadeData, JsonRequestBehavior.AllowGet);
}

E fiz isso na minha view:
//Meu Jquery para preencher minhas cidades no método change do Jquery
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#estado").change(function () {
var idModel = $(this).val();
$.getJSON("/Home/CarregaCidade", { id: idModel },
function (cidadeData) {
var select = $("#cidade");
select.empty();
select.append($('<option/>', {
value: 0,
text: "Selecione uma cidade"
}));
$.each(cidadeData, function (index, itemData) {

select.append($('<option/>', {
value: itemData.Value,
text: itemData.Text
}));
});
});
});
</script>

E as minhas combos(tag select)

@using (Html.BeginForm(null, null, FormMethod.Post, new { @id = "formCascade" }))
{
<p>
<label class="txtLabel">
Estado:
</label>
<select id="estado" name="estado" @Html.DropDownListFor(Model => Model.tbEstado, new SelectList(ViewBag.Estado as System.Collections.IEnumerable, "Id", "Estado"),
"Selecione um estado", new { id = "estado" }) >
<option value="C"></option>
</select>
</p>
<p>
<label class="txtLabel">
Cidade:
</label>
<select name="cidade" @Html.DropDownListFor(Model => Model.Cidade, new SelectList(Enumerable.Empty<SelectListItem>(), "tbEstado_id", "Cidade"),
"Selecione uma cidade", new { id = "cidade" })>
<option value="M"></option>
</select>
</p>
}

Não carrega as cidades quando eu escolho o estado