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

[luizpaulobtu 0]

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!

[EdCesar 124]

@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 255]

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

 

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 0]

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