Ir ao conteúdo
  • Cadastre-se

Pegar retorno de url


Ir à solução Resolvido por DiF,

Posts recomendados

beleza pessoal,

tenho um botão que ao ser clicado envia um comando a um servidor:

<a class="active btn btn-lg btn-warning" id="desligalamfach" href="http://192.168.0.30/msg?pin=2&amp;stat=1&amp;action=pwi">Desligar</a>

e o servidor responde com "good" ou algum outro retorno de erro.

 

Meu problema é quando eu clico nesse botão, abre-se uma nova página com o retorno deste comando, estou precisando mudar isto para quando eu clicar, enviar o comando mas não abrir página nenhuma mas pegar de volta o retorno do servidor e mostrar em um "alert" por exemplo. 

 

Alguém pode me ajudar?

 

Link para o comentário
Compartilhar em outros sites

  • Moderador

@ViniciusKruz Faça usando a requisição assíncrona(Ajax)

 

Por exemplo:

 

<a class="active btn btn-lg btn-warning desligar" id="desligalamfach" href="http://192.168.0.30/msg?pin=2&amp;stat=1&amp;action=pwi">Desligar</a>

$(document).ready(function(){
   var botao  = $(".desligar");
  
   botao.on("click", function(e){
       e.preventDefault(); 
       $.ajax({
            url: "http://192.168.0.30/msg",
            dataType: "html",
            method: "GET",
            data: {pin: "2", stat:"1", action:"pwi"}
       }).done(function(retorno){
             alert(retorno);  
       });
   
   });
});

 

Explicação resumida:

Adiciona um class nova no seu link chamado "desligar"

armazena o botão em uma variável.

chama a função ON()  com o evento de click.

Dentro desta função você chama a função $.ajax()  dentro dela vocÊ passa alguns parâmetros onde:

url é o endereço, dataType é o tipo de dado, o method é o método se é post ou get, data é onde você define os dados que estás enviando.

a função done() chama um alert com o retorno.. no caso a mensagem "good"

 

PS: usei o jQuery

Link para o comentário
Compartilhar em outros sites

@JorgeSouza

Obrigado pela dica!

Esse tutorial é bem simples e objetivo mas pro meu caso não resolve porque preciso do alert para retornos externos, mas esses exemplos serão muito úteis pra uma outra coisa.

 

@dif

Vou testar aqui e depois dou um retorno, muito obrigado por enquanto.

 

 

Link para o comentário
Compartilhar em outros sites

@dif

 

Quando clico no botão não ta acontecendo nada, eu removi o link dele ficando assim:

<a class="active btn btn-lg btn-warning" id="desligalamfach">Desligar</a>

e o script (depois do </body>):

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
	$.ajax({
		$(document).ready(function(){
		var botao  = $(".desligar");
  
		botao.on("click", function(e){
		e.preventDefault(); 
		$.ajax({
            url: "http://192.168.0.30/msg", //"http://192.168.0.30/msg",
            dataType: "html",
            method: "GET",
            data: {pin: "2", stat:"1", action:"pwi"}
			}).done(function(retorno){
             	alert(retorno);  
			});
   
			});
		});
	}
</script>

 

 

 

 

Link para o comentário
Compartilhar em outros sites

  • Moderador
  • Solução

@ViniciusKruz Ah sim, esqueci de tirar o link do href!  deixe como # mesmo.

 

Outra coisa,  está errado a ordem ali

A função $.ajax() deve estar dentro de $(document).ready().

 

OUtro erro é que quando postei o exemplo RESSALTEI que podias criar um CLASS chamado desligar para o botão

que é chamado assim: var botao = $(".desligar");

Além disso, a versão do seu jquery é defasada.  use a versão mais recente 3.1.0 

se quiser podes até usar a CDN do google

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

 

 

Tente assim:

<a class="active btn btn-lg btn-warning desligar" id="desligalamfach" href="#">Desligar</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript">
	
//quando o documento estiver pronto
$(document).ready(function(){ 
  
//armazena o botão em uma variável
   var botao  = $(".desligar");
  
//atribui a ação de clique no botão
   botao.on("click", function(e){
          
//previne erro de clicar várias vezes, é a mesma coisa que return false  
      e.preventDefault(); 
          
//chama a função de ajax  
      $.ajax({
           
//Endereço do arquivo na qual será requisitado
      url: "http://192.168.0.30/msg", 
          
//define o tipo de retorno. se é html, json ou outro qualquer 
     dataType: "html",
          
//define o tipo de envio se é por GET ou POST
    method: "GET",
          
//indica os valores que serão passados por GET é a mesma coisa que pin=2&stat=1&action=pwi
    data: {pin: "2", stat:"1", action:"pwi"}
}).done(function(retorno){ //funçção de retorno. chama um alert com a mensagem do servidor "good"
             	alert(retorno);  
       });
	});
});
	
</script>

Deixei bem mais comentado dessa vez para que você aprenda para que serve cada linha.

  • Curtir 2
Link para o comentário
Compartilhar em outros sites

26 minutos atrás, dif disse:

Deixei bem mais comentado dessa vez para que você aprenda para que serve cada linha.

 

Tá mastigado mesmo hehehe!!!

 

Funcionou, ta perfeito, só que usando como você colocou: 

27 minutos atrás, dif disse:

data: {pin: "2", stat:"1", action:"pwi"}

 

o servidor não executou o comando, mas retornou OK, estranho né??!! Daí resolvi comentar esta linha e colocar os valores na url. 

 

De qualquer forma, está funcionando graças à sua generosidade, muito obrigado mesmo, não tem noção o quanto me ajudou!!! 

 

  • Curtir 2
Link para o comentário
Compartilhar em outros sites

Visitante
Este tópico está impedido de receber novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...