Conforme imagem abaixo, preciso que, ao ser selecionado a empresa, outros campos zoom como filial, seção e função, sejam filtrados/mostrados, de acordo com a empresa selecionada, eu tenho um dataset para cada cada campo (ds_empressa, ds_filial, ds_secao e ds_funcao), porém não estou conseguindo fazer isso e não encontrei um exemplo aqui que me atende, olhei a documentação, mas não consegui resolver, alguém poderia me ajudar?
<div class="row">
<div class="form-group col-md-6">
<label for="empresa">Empresa:</label>
<input
type="zoom"
id = "empresa"
name="empresa"
data-zoom="{
'displayKey':'Nome',
'datasetId':'ds_Consulta_Coligada',
'maximumSelectionLength':'1',
'placeholder':'Escolha a Empresa',
'fields':[
{
'field':'CodColigada',
'label':'Codigo',
'standard':'true'
},{
'field':'Nome',
'label':'Nome',
'standard':'true'
}
]
}"
/>
</div>
<div class="form-group col-md-6">
<label for="Filial">Filial:</label>
<input
type="zoom"
id = "filial"
name="filial"
data-zoom="{
'displayKey':'Nomefantasia',
'datasetId':'ds_Consulta_Filial',
'maximumSelectionLength':'1',
'placeholder':'Escolha a Filial',
'fields':[
{
'field':'Codfilial',
'label':'CodFilial',
'standard':'true'
},{
'field':'Nomefantasia',
'label':'Nome',
'standard':'true'
}
]
}"
/>
</div>
</div>
<div class="row">
<div class="form-group col-md-6">
<label for="gestor">Nome do Gestor:</label>
<input
type="zoom"
id = "gestor"
name="gestor"
data-zoom="{
'displayKey':'colleagueName',
'datasetId':'colleague',
'maximumSelectionLength':'1',
'placeholder':'Escolha o Gestor',
'fields':[
{
'field':'colleagueName',
'label':'Nome',
'standard':'true'
}
]
}"
/>
</div>
<div class="form-group col-md-6">
<label for="avaliado">Nome do Avaliado:</label>
<input
type="zoom"
id = "avaliado"
name="avaliado"
data-zoom="{
'displayKey':'colleagueName',
'datasetId':'colleague',
'maximumSelectionLength':'1',
'placeholder':'Escolha o Avaliado',
'fields':[
{
'field':'colleagueName',
'label':'Nome',
'standard':'true'
}
]
}"
/>
</div>
</div>
<div class="row">
<div class="form-group col-md-6">
<label for="secao">Seção do Avaliado:</label>
<select class="form-control" name="secao" id="secao" dataset="ds_Consulta_Secao" datasetkey="descricao" datasetvalue="descricao"></select>
</div>
<div class="form-group col-md-6">
<label for="funcao">Função do Avaliado:</label>
<!-- <select class="form-control" name="funcao" id="funcao" dataset="ds_Consulta_Funcao" datasetkey="nome" datasetvalue="nome"></select> -->
<input type="text" name="funcao" id="funcao" class="form-control">
</div>
</div><script>
function setSelectedZoomItem(selectObject) {
var obj = selectObject['inputId'];
if (obj == 'empresa') {
reloadZoomFilterValues("filial", "CodFilial," + selectObject["CodColigada"]);
}
}
</script>