Publicado em 31 de out.

Melhor forma popular uma select (que usa ajax) na hora de editar um registro?

#javascript #ajax #combo #jquery #select

Boa tarde galera, meu nome é Luiz Paulo, primeiro post aqui no iMasters e chego aqui com uma dúvida bem filosófica... busquei algo mas não encontrei, talvés explicando fique mais fácil de vocês caros colegas e amigos desenvolvedores me ajudarem

No seguinte exemplo:

-
Temos um formulário de cadastro com Nome, Idade, Endereço (campos input texto) e Cidade e Bairro (selects), sendo que bairro popula via AJAX quando o usuário seleciona a Cidade (consulta pelo código e retorna o JSON q faz o append em Bairro)

Se tivermos que editar tal registro, qual a melhor maneira vocês sugerem para puxar já preenchido todos os campos, em especial a Cidade e o Bairro (que popular via AJAX), permitindo que ele possa alterar um deles.

Atualmente eu utilizo um script no final do código q puxa o Bairro no document.ready() com um setTimeout depois de 800ms de carregamento da página, de acordo com o valor já selecionado da Cidade (nesse caso ele já inclui direto o valor no HTML via echo do PHP, que faz um selected="selected" básico hehehe)

Fiquem a vontade para dar sugestões e soluções, Abraço!

Discussão (3)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

EdCesar· 31 de out.

@luizpaulobtu, joia! Não que você esteja fazendo errado, uma outra visão é:

	Você não sabe se o campo cidade e bairro sera alterado, talvez não seja, então não seria desperdício popular todo o select da cidade, selecionar a cidade e chamar o bairro? Fora os 800ms que do ponto de vista da web é muito tempo!

	Você poderia, na edição, simplesmente criar os campos cidade e bairro com apenas uma informação, que seria a cidade e bairro do usuário, da mesma forma que faz com os demais campos. Caso o campo bairro seja clicado, ai sim então você faz um ajax e popula os demais bairros, o mesmo para o campo cidade. Fora os 800ms que você não precisara mais esperar, você poderá economizar duas requests ao servidor, caso o usuário não tenha a intenção de alterar estes campos.

gabrieldarezzo· 31 de out.

Tem uma terceira approach que é fazer apenas uma unica requisição (e aproveitar do cacheamento).

Exemplo abaixo com Estados x Cidades.

	Seria popular todos os estados e a cada escolha refazer o select das cidades, isso tudo do lado do client (js) evitando requisições futuras.

	 

	Ex de Estados/Cidades:

	SP:

	--Campinas

	--São Paulo (Capital)

	-- Guarulhos

	... (etc)

	 

	 

	RJ:

	--Barra Mansa

	--Cabo Frio

	--São Gonçalo

	... (etc)

	 

	 

	TL;DR ----

	 

	Pro : 

	- Uso de Cache pode ser usado tranquilamente

	- Evita futuras requisições

	- Diminui sempre a quantidade/possibilidade em forma de arvore:

	 

	Contra: 

	- Carrega todas as cidades do Brasil 

	 

	 

	Veja um exemplo pratico (Em Js Vanilla / ou jQuery):

	[https://github.com/gabrieldarezzo/desafiosInternos/tree/master/select](https://github.com/gabrieldarezzo/desafiosInternos/tree/master/select)

2 horas atrás, luizpaulobtu disse:

setTimeout depois de 800ms

Cuidado ai, 99% das vezes q eu vejo um setTimeout em código alheio é alguma gambiarra por falta de entendimento do conceito de Callbacks

https://pt.stackoverflow.com/questions/27177/o-que-é-callback

luizpaulobtu· 31 de out.

Sim @EdCesar , essa é uma abordagem legal, no caso do cara clicar no campo popular economizar requests

@gabrieldarezzo muito interessante o uso de cache, bem... confesso q o setTimeout é meio que uma "gambiarra" para esperar um pouco pois tinha vezes que parecia não processar de primeira o retorno do JSON, sei lá, deve ser trauma meu rs

A idéia é conhecermos diferentes abordagens pois tem horas que eu penso q deve ter um jeito "mais certo" ou "mais fácil" rss