Estou implementando em um sistema a consulta através de um input utilizando o Autocomplete do Jquery UI. Na prática ao consultar um valor pelo campo nome(Ex: São) o meu input exibirá uma lista com os possíveis retornos(São Paulo, São Bernardo...). Esse resultado já possível no meu script, porém eu preciso manipular o Id da cidade selecionada. Sendo que o nome servirá apenas para visualização/seleção do usuário.
Tenho um arquivo php que retorna o Json com as seguintes colunas da tabela, id
e nome
.
Já no meu script Jquery eu tenho uma variável do tipo array
na qual eu armazeno os dados da consulta. Creio que meu problema está aqui, pois não estou sabendo armazenar de uma forma que eu consiga pegar o id
.
$.getJSON('<?=URL;?>/return-city', function(data){
var arr = [];
// Armazena no array
$(data).each(function(key, value) {
arr.push(value.nome); //Guardo apenas o nome,
//porém preciso passar o id para posterior resgate
});
console.log(arr);
$('#location').autocomplete({ source: arr, minLength: 3,
select: function(event, ui) {
var retorno = ui.item.value;
console.log(retorno);
},
});
});
Este é o retorno do meu Json
[Object { nome="Acrelandia", uf="AC", id="0001"}, Object { nome="Assis Brasil", uf="AC", id="0002"}
No evento select
eu preciso saber como manipular qualquer valor do array seja o nome ou id.
nome
no eventoSELECT
pois ele que seleciono na lista. Porém o nome só serve para o usuário selecionar a cidade. Em background ao selecionar uma cidade pelo camponome
eu preciso manipular oid
da mesma para inserir num banco de dados.