Tenho dois combobox no qual o segundo possui um carregamento em cascata isto é, quando eu seleciono algo no primeiro, é feita um consulta no banco e os dados devem preencher o segundo... Minha controller parece estar devolvendo um array json corretamente, mas acho que na hora de fazer o loop (bloco JS) não estou conseguindo carregar corretamente o segundo bombobox (id="contatoTipo")... Alguém sabe como me ajudar?
Controller:
[HttpPost]
[Route("pessoa-fisica-gerenciar/getContatoTipo")]
public IActionResult getContatoTipo(PessoaFisicaFormaContato pessoaFisicaFormaContato)
{
var pessoasFisicasFormasContatos = new SelectList(_pessoaFisicaFormaContatoTipoAppService.GetAllByPessoaFisicaContato(pessoaFisicaFormaContato), "Id", "ContatoTipo", 0);
return Json(new
{
data = pessoasFisicasFormasContatos
});
}
DropDowns:
<div class="col-md-3">
<label asp-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.PessoaFisicaFormaContato" class="control-label lb-pessoa-fisica-forma-contato">Forma de Contato</label>
<select id="pessoaFisicaFormaContatoTipo" asp-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.PessoaFisicaFormaContato" asp-items="@Model.PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.FormasContatos" data-plugin="selectpicker" title="Selecione uma opção" class="form-control show-tick show-menu-arrow sel-pessoa-fisica-forma-contato"></select>
<span asp-validation-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.PessoaFisicaFormaContato" class="text-danger val-pessoa-fisica-forma-contato"></span>
</div>
<div class="col-md-3">
<label asp-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.ContatoTipo" class="control-label lb-contato-tipo">Tipo de Contato</label>
<select id="contatoTipo" asp-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.ContatoTipo" asp-items="@Model.PessoaFisicaViewModel.PessoasFisicasContatosTipos" data-plugin="selectpicker" title="Selecione uma opção" class="form-control show-tick show-menu-arrow sel-contato-tipo"></select>
<span asp-validation-for="PessoaFisicaViewModel.PessoasFisicasContatosViewModel[i].PessoaFisicaFormaContatoTipoViewModel.ContatoTipo" class="text-danger val-contato-tipo"></span>
</div>
JS:
<script>
$(document).ready(function () {
$("#pessoaFisicaFormaContatoTipo").on("change", function () {
$list = $("#contatoTipo");
$.ajax({
url: "/pessoa-fisica-gerenciar/getContatoTipo",
type: "POST",
data: { pessoaFisicaFormaContato: $("#pessoaFisicaFormaContatoTipo").val() },
traditional: true,
success: function (result) {
$list.empty();
$.each(result, function (i, item) {
$list.append('<option value="' + item["Id"] + '"> ' + item["ContatoTipo"] + ' </option>');
});
console.log(result);
},
error: function () {
alert("Something went wrong call the police");
}
});
});
});
</script>
$list.append('<option value="' + item["value"] + '"> ' + item["text"] + ' </option>');
item.text
tbm?