I am working with PHP and I have a form with the Establishment, Service and Sector fields. These 3 are dependent combobox and the order is: choose an establishment, then service and finally sector. Everything works fine but now I notice a problem. When I select an establishment that has a service and sector, everything is fine, but when I select an establishment that does not have a service or sector, it shows me that it does not apply to the service, but I cannot get the sector to remain as not applicable and this causes the sector to obviously not show information and does not allow me to save. I am looking forward to your help or guidance in solving this. My code is the following:
//// TO SEARCH THE SERVICE AFTER SELECTING THE ESTABLISHMENT/////
$query=$db->query("select * from servicio where id_establecimiento=$_GET[establecimiento] and
estatus = 1
ORDER BY nombre_servicio ASC");
$servicios = array();
while($r=$query->fetch_object()){ $servicios[]=$r; }
if(count($servicios)>0)
{
print "<option value=''>-- SELECCIONE --</option>";
foreach ($servicios as $ser)
{
print "<option value='$ser->id'>$ser->nombre_servicio</option>";
}
}
else
{
print "<option value=''>NO APLICA</option>";
}
///// TO SEARCH THE SECTOR AFTER SELECTING THE SERVICE/////
$query=$db->query("select * from sector where service_id=$_GET[service] and status = 1 ORDER BY sector_name ASC");
$sectores = array();
while($r=$query->fetch_object()){ $sectores[]=$r; }
if(count($sectores)>0)
{
print "<option value=''>-- SELECCIONE --</option>";
foreach ($sectores as $se)
{
print "<option value='$se->id'>$se->nombre_sector</option>";
}
}
else
{
print "<option value=''>NO APLICA</option>";
}
/////////MY FORM////////
<div class="form-group">
<div class="row">
<div class="col-md-6">
<select class="form-control" id="establecimiento" name="establecimiento">
<option value="">Selecciona un Campo Formador y/o Campo Clínico </option>
<?php foreach ($all_establecimiento as $est): ?>
<option value="<?php echo (int)$est['id'] ?>">
<?php echo $est['name'] ?></option>
<?php endforeach; ?>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-md-6">
<select class="form-control" id="servicio" name="servicio" required>
<option value="">Servicio donde se requiere la Pasantia</option>
</select>
</div>
<div class="col-md-6">
<select class="form-control" id="sector" name="sector" required>
<option value="">Seleccione Sector (SI APLICA)</option>
</select>
</div>
</div>
</div>
/////JAVASCRIPT/////
<script type="text/javascript">
$(document).ready(function()
{
$("#establecimiento").change(function()
{
$.get("servicios.php","establecimiento="+$("#establecimiento").val(), function(data){
$("#servicio").html(data);
console.log(data);
});
});
$("#servicio").change(function()
{
$.get("sectores.php","servicio="+$("#servicio").val(), function(data){
$("#sector").html(data);
console.log(data);
});
});
});
</script>
When selecting an establishment you load services, once you load the services load the sectors according to the selected service. Look where I am calling the function that loads the sectors, you have to make sure that the services have already been loaded previously.