Carregar um select baseado em um anterior
Wed Jul 17 2024 22:54:24 GMT+0000 (Coordinated Universal Time)
Saved by @jdeveloper #php #jquery
JS
$('#ceremonial').change(function () {
var ceremonial_id = $(this).val();
$('#responsible_ceremonial_name').empty().append('<option value=""></option>');
$('#responsible_ceremonial_phone').val('');
if (ceremonial_id) {
$.ajax({
url: BASE_URL + 'Ajax/getResponsibleCeremonialName',
type: 'POST',
data: { ceremonial_id: ceremonial_id },
dataType: 'json',
success: function (data) {
$('#responsible_ceremonial_name').append('<option value="new">Novo</option>');
$.each(data, function (index, responsible_ceremonial) {
$('#responsible_ceremonial_name').append('<option value="' + responsible_ceremonial.id + '">' + responsible_ceremonial.name + '</option>');
});
},
error: function (jqXHR, textStatus, errorThrown) {
console.error('Erro ao buscar responsavel pelo cerimonial: ' + textStatus);
}
});
}
});
HTML - Primeiro Select normal preenchido pelo BD
<div id="select_ceremonial" class="col-lg-3 col-md-8">
<!-- <label for="">Informações do Local do evento:</label> -->
<div class="input-group mb-3">
<div class="input-group-prepend">
<!-- <label class="input-group-text" for="ceremonial">Local</label> -->
</div>
<select class="custom-select" id="ceremonial" name="ceremonial">
<option value="" selected></option>
<option value="0">Novo</option>
<?php foreach ($ceremonials as $ceremonial) : ?>
<?php if (isset($info_event)) : ?> <!-- verificando se o form é create ou edit -->
<option value="<?= $ceremonial['id'] ?>" <?= ($info_event['ceremonial_id'] == $ceremonial['id']) ? 'selected' : '' ?>><?= $ceremonial['name'] ?></option>
<?php else : ?>
<option value="<?= $ceremonial['id'] ?>"><?= $ceremonial['name'] ?></option>
<?php endif; ?> <!-- fim da verificação create edit -->
<?php endforeach; ?>
</select>
</div>
</div>
O SELECT A SER PREENCHIDO
<div class="col-lg-2 col-md-6 responsible-ceremonial-name">
<div class="input-group mb-3">
<!-- select controlado por js -->
<select class="custom-select" name="responsible_ceremonial_name" id="responsible_ceremonial_name">
<option value="" selected></option>
</select>
<!-- fim select controlado -->
</div>
</div>
AJAXCONTROLLER
public function getResponsibleCeremonialName()
{
$ResponsibleCeremonial = new ResponsibleCeremonial();
$filters = array();
$filters['ceremonial_id'] = filter_input(INPUT_POST, 'ceremonial_id');
$responsibles = $ResponsibleCeremonial->getAll(200, 0, $filters);
echo json_encode($responsibles);
}



Comments