Ir para conteúdo

POWERED BY:

Arquivado

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

Fábio BN

Auto Busca ao deixar o campo?

Recommended Posts

Oi Pessoal.

 

Tenho uma tela de cadastro, onde no Campo Usuário eu faço uma auto busca para determinar se o usuário já encontra-se cadastrado, porém esse leitura é feita conforme o usuário vai digitando e já vai informando em tela o resultado, sendo usuário ( OK ) ou ( Nome de Login Já cadastrado, escolha outro ), até aqui tudo bem.

 

Porém ele lê cada caractere em tempo real ao ser digitado e já mostra em tela o resultado, mas eu gostaria que a busca fosse feita apenas quando o usuário deixar o campo, digamos que apareça usuário de login já cadastrado, além de aparecer a mensagem, eu gostaria que o cursor retornasse ao campo de login automaticamente para que a pessoa posso digitar outro login!

 

Eu tentei outros tipos de comandos para apenas ser executada ao deixar o campo mas nenhuma deu certo.
Atualmente uso o comando " keyup ", porém tentei outros para tentar fazer a busca após deixar o campo mas nenhum funcionou, ou não acontecia nada, ou fazia a mesma busca do " keyup ".
Estou usando a auto busca do Jquery que é bem simples e funciona bem, ela acessa o arquivo do POST enviando a variável ( pesquisa ) e retorna o resultado na DIV ( resultados ) <div class="resultados">


<input class="form-control largura_245" id="usuario" name="usuario" type="text" placeholder="Usuário" maxlength="15" required autofocus>


 <script type="text/javascript" >
$(function(){
$("#usuario").keyup(function(){
      var usuario = $(this).val();

   if(usuario != '' ){
      var dados = {
	  palavra : usuario
	  }
	  
 
     $.post('verifica_usuario.asp', dados, function(retorna) {
	 $(".resultados").html(retorna);
	 
	 });
   
   }
   
	});
	
});
	

</script>

Retorno:

<div class="resultados">

Se alguém tiver alguma sugestão, agradeço.

Obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

use assim:

 

 

$("#usuario").on('blur', function(){

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funcionou, obrigado.

 

Agora digamos que a pessoa colocou um usuário já existente. A <div class="resultados"> vai dar a mensagem ( Nome de Login Já cadastrado, escolha outro ), até aqui funciona bem.

 

 

Você sabe como eu faço para quando pessoa clicar novamente no Campo Usuário para redigitar o usuário, acontecer os seguintes eventos:
- Limpar o conteúdo do campo usuário quando o mesmo for clicado.
- Limpar o conteúdo da DIV <div class="resultados">

 

Abraços!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom.

 

O primeiro problema resolvi usando ( onfocus="this.value=''" )

Linha inteira:
<input class="form-control largura_245" id="usuario" name="usuario" type="text" placeholder="Usuário" maxlength="15" required autofocus onfocus="this.value=''">

 

Só falta agora limpar a class="resultados"

 

Abraços!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu testei algo simples aqui e funcionou:

onfocus=$(".resultados").html("")

<input class="form-control largura_245" id="usuario" name="usuario" type="text" placeholder="Digite o Usuário" maxlength="15" required autofocus onfocus=$(".resultados").html("")>

Eu só não consegui fazer o ( onfocus="this.value=''" ) funcionar junto com o onfocus=$(".resultados").html(""), alguém, tem alguma sugestão?

 

Abraços!

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui resolver da seguinte forma:

    <script>
        function limpar_campo_class()  
        {  
            //Limpa DIV Resultados 
          $(".resultados").html("")
		  
		             //Limpa Campo Usuário
        document.getElementById('usuario').value='';
            
			
        }  
		
		</script>  

E

    <input class="form-control largura_245" id="usuario" name="usuario" type="text" placeholder="Digite o Usuário" maxlength="15" required autofocus onfocus="limpar_campo_class();"> 

Abraços!

 

Fábio!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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