Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

luizpaulobtu

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

Recommended Posts

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 :smile:

 

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!

Compartilhar este post


Link para o post
Compartilhar em outros sites

@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.
 

Compartilhar este post


Link para o post
Compartilhar em outros sites

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

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

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

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por Thiago Duarte
      Oi, gostaria de arrastar imagem e ao soltar formar bloco html, meu bloco de html ficaria com nome, content-1.html, content-2.html, etc
       
      Alguem pode me ajudar?
    • Por FabianoSouza
      Eu preciso exibir duas informações em minha consulta:
      1) A quantidade de pessoas inscritas numa turma de treinamento (isso é feito com um simples COUNT)
      2) Uma flag de excesso de inscrições na turma. Seria obtido pela comparação entre a quantidade máxima permitida (já existe esse campo) e o COUNT feito acima.
       
      Até aqui sem problemas.
       
      O que quero é evitar fazer duas contagens (1 para saber a quantidade de inscritos, e outra para gerar a flag de excesso de inscrições).
       
      Há uma forma de utilizar UMA contagem para atender as duas necessidades?
       
      Meu código está assim:
       
      ... --AQUI FAZ A COMPARAÇÃO PARA GERAR A FLAG DE EXCESSO DE INSCRIÇÕES , CASE WHEN (SELECT COUNT(*) FROM dbo.tab AS ITT WHERE ITT.codTurmaDeTreina = T.id) > T.lotacaoMax Then T.nome + '&nbsp;'+'<span class=%22icon-aviso fcolor-critico%22 style=%22font-size:18px%22 title=Excesso&nbsp;de&nbsp;inscrições></span>' --AQUI FAZ A CONTAGEM DE INSCRIÇÕES , (SELECT COUNT(*) FROM dbo.tab AS ITT WHERE ITT.codTurmaDeTreina = T.id) AS 'Inscrições'  
    • Por FabianoSouza
      Possuo uma coluna de data.
      Eu gostaria que os registros com datas futuras aparecessem no topo do meu select, em relação aos demais registros.
      Em seguida, gostaria que somente esses registros com datas futuras ficassem em ordem crescente.
      Algo como 
       
      João  | 16/11/2023
      Maria | 17/11/2023
      José  |  20/11/2023
       
      -----------------------------
      (demais registros da base)
      Antônio   |  20/05/2023
      Rosa        | 15/08/2023
      Cida         | 15/10/2022
      Pedro      |  20/05/2021
      Paulo      |  14/11/2020
       
      O select seria esse.
      select dbo.formataData(ET.dataInicial) AS 'data' FROM dbo.tab AS ET GROUP BY ET.dataInicial  
    • Por ILR master
      Salve galera.
       
      Vou publicar um evento e quero colocar um Cronômetro regressivo que mostre em tempo real os dias, horas e minutos que faltam para determinada data, tipo:.
      Faltam 5 dias, 12:30:00 para inauguração.
       
      Qdo chegar no dia, quero que apenas apareça uma mensagem.
       
      Alguém pode me ajudar?
    • Por ment0r
      Boa noite pessoal, tudo bem?
       
      Estou desenvolvendo um sistema simples com exibição de formulário via modal. Uma vez cadastrado o serviço (tabela possui apenas dois campos, id e nome), eles são exibidos numa tabela com um ícone que permite a alteração do nome.

       
      Eu clico no ícone e é chamado um modal que é gerado via ajax (pois são vários registros).
       

       
      Nesse modal é mostrado o serviço e uma vez alterado, o botão Salvar chama uma função que atualiza a tabela servico, concluindo a tarefa. Fiz o mesmo processo pra cadastrar o serviço, com a diferença de que o modal está presente na mesma página, ou seja, não é chamado via ajax.
       
      Eis os códigos:
      <a href="#" onclick="modalUpdate(<?= trim($array['id']) ?>)"> <i class='bx bx-edit'></i> </a> // Trecho onde eu chamo a função modalUpdate. Função btAltServico click:
      $('#btAltServico').click(function() { var inpnome = $('#nome'); var inpid = $('#id'); if (inpnome.val() == '') { swal("Atenção", "Por favor, preencha os campos obrigatórios", "warning"); if (inpnome.val() == '') { inpnome.css("border","2px solid #f94545"); } else { inpnome.css("border",""); } alert(inpnome); alert(inpid); } else { $.ajax({ url: '../inc/ajax/altServico.php', type: 'post', dataType: 'json', // pode ser html data: { nome : inpnome.val(), id : inpid.val() }, success: function(resposta){ if (resposta == 1) { inpnome.val(""); inpnome.css("border",""); swal("Sucesso", "Serviço alterado", "success"); } else { if (resposta == 0) { swal("Erro", "Serviço não alterado. Log de erro gerado.", "error"); } else { swal("Atenção", "Serviço já cadastrado", "warning"); } } } }) } });  
      E modalUpdate.php :
       
      <?php /* * altServico.php * * Script responsável pelo update de serviços na tabela servico * * Função chamada pelo arquivo ajax.js */ //if ($_POST) { require'../conn.php'; require'../../class/class.geral.php'; $geral = new Geral(); $nome = $_POST['nome']; $id = $_POST['nome']; $ativo = 1; // Verifica se o servico já foi cadastrado $sqlVer = "select nome from algo68_db_cliente.servico where nome = '".$nome."' and id <> ".$id.""; $queryVer = mysqli_query($conn, $sqlVer); $resultVer = mysqli_num_rows($queryVer); if ($resultVer > 0) { echo json_encode(2); // servico já cadastrado } else { // Update do servico $sql = "update algo68_db_cliente.servico set nome = '".$nome."', ativo = ".$ativo." where id = ".$id; $query = mysqli_query($conn, $sql); $result = mysqli_affected_rows($conn); if ($result > 0) { echo json_encode(1); // alterou o servico } else { $geral->logErro(date('d/m/Y|H:i:s'), @$_SERVER[REQUEST_URI], 'AlterarServico', mysqli_error($conn)); echo json_encode(0); // não alterou o servico } } //} ?> O problema é que quando clico no botão Salvar, não acontece nada - se eu colocar um alert qualquer na função click, só pra saber se está chegando, também não da nada. E está da mesma forma que o cadastro de serviço, que funciona perfeitamente.

      Bom, é isso pessoal, tentei ser o mais breve e especifico possível. Qualquer ajuda é bem vinda, obrigado a todos, desde já.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.