Estou com um problema que não sei como posso resolver. Tenho um função Ajax q faz uma query baseado no item escolhido de um select. Após a query e recebido os dados da pesquisa no front-end, preencho os inputs com os dados, como por exemplo: Nome do Convênio, Rua, Bairro, etc... Porém existe os telefones, que pode haver mais de um dependendo do convênio. Criei uma função que preenche uma div com os campos de telefone, que está funcionando, mas não estou conseguindo inserir os valores do telefone dentro desses inputs. Tentei criar um array fora da função Ajax e fazer algo após isso, mas também não funcionou. Preciso de alguma ideia de como pode ser feito isso.
<form action="/dashboard/convenio/update" method="POST">
@csrf
<meta name="csrf-token" content="{{ csrf_token() }}">
<div class="row">
<div class="input-fiel col s12">
<select name="cod_convenio" id="cod_convneio" class="select">
<option value="" disabled selected>Escolha o Convênio</option>
@foreach($results as $result)
<option value="{{ $result->cod_convenio }}">{{ $result->nome_convenio }}</option>
@endforeach
</select>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="nome_edit" name="nome_convenio" type="text" class="validate">
<label for="nome_convenio">Nome do Convênio</label>
</div>
</div>
<div class="row">
<div class="input-field col s4">
<input placeholder="Rua, Avenida..." id="rua_edit" name="rua_convenio" type="text" class="validate">
<label for="rua_edit">Rua</label>
</div>
<div class="input-field col s4">
<input id="bairro_edit" palceholder="Bairro" name="bairro_convenio" type="text" class="validate">
<label for="bairro_edit">Bairro</label>
</div>
<div class="input-field col s4">
<input id="cidade_edit" placeholder="Cidade" name="cidade_convenio" type="text" class="validate">
<label for="cidade">Cidade</label>
</div>
</div>
<div class="row">
<div id="reference_edit">
<div class="input-field col s2">
<i class="material-icons prefix">phone</i>
<input id="input-field col s3 icon_telephone" name="telefone[]" type="tel" class="validate">
<a id="add" class="btn-floating btn-small waves-effect waves-light green">
<i class="material-icons">add</i>
</a>
<label for="icon_telephone">Telefone</label>
</div>
</div>
<div id="insert_edit"></div>
<script src="{{ asset('js/searchConvenio.js') }}"></script>
</div>
<div class="divider"></div>
<p>
<label>
<input type="checkbox"/>
<span>Ativado</span>
</label>
</p>
<button class="btn waves-effect waves-light" type="submit" name="action">Alterar
<i class="material-icons right">send</i>
</button>
</form>
let telefones = new Array()
$(document).ready(function(){
$('#cod_convneio').change(function(){
// console.log('im working!')
let cod = $(this).val()
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
url: '/dashboard/convenio/find',
type: 'POST',
data: {cod},
success: function(result){
$('#insert_edit').empty()
telefones = []
$('#nome_edit').val(result['nome_convenio'])
$('#rua_edit').val(result['rua_convenio'])
$('#bairro_edit').val(result['bairro_convenio'])
$('#cidade_edit').val(result['cidade_convenio'])
for(var i=0;i<result['telefones'].length;i++){
const htmlString = '<div id="telefone'+i+'" class="input-field col s2"><input maxlength="14" id="input-field col s3 icon_telephone edit'+i+'" name="telefone[]" type="tel" class="validate"><a id="remove" class="btn-floating btn-small waves-effect waves-light red"><i class="material-icons">remove</i></a><label for="icon_telephone">Telefone</label></div>'
$(htmlString).appendTo('#insert_edit')
telefones[i] = result['telefones'][i]['numero_telefone']
}
}
})
$(document).change(function(){
console.log(telefones)
for(var i=0;i<telefones.length;i++){
//console.log(telefones[i])
$('#input-field col s3 icon_telephone edit'+i).val(telefones[i]['numero_telefone'])
}
})
})
})
{nome_convenio: "Unimed", rua_convenio: "Av Barao do Rio Branco", bairro_convenio: "Centro", cidade_convenio: "Juiz de Fora", telefones: Array(2), …} activated: 1 bairro_convenio: "Centro" cidade_convenio: "Juiz de Fora" nome_convenio: "Unimed" rua_convenio: "Av Barao do Rio Branco" telefones: Array(2) 0: numero_telefone: "32 3232-1122" __proto__: Object 1: numero_telefone: "32 3525-9100" __proto__: Object