Ir para conteúdo

Arquivado

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

  • 0
AnthraxisBR

É errado um usar um callback falso pra devolver o valor 'pra cima' ?

Pergunta

Eu tenho um evento, que dispara um função indicando qual é o' $this' do evento, essa função dispara uma requisição ajax, e com base nessa resposta do ajax, eu defino qual ação vai ser executada. algo como isso:

 

//Evento de disparo
$(document).on('click', '.elemento', function () {
    //Passando este elemento, para o interactor
    $this = $(this);
    //Metodo callback simulado, passando o elemento disparador como $this.
    metodo_da_requisicao($this, function (data) {
        //Coisas a ser fazer com a resposta data;
    }
});
//Função de requisição
function metodo_da_requisicao($this,callback) {
  	var dados = 'informação';
    $.ajax({
        //Define o método, OBRIGATORIAMENTE POTS    
        type: "POST",
        //Define o arquivo do caller
        url: "caller.php",
        //Define os dados a serem transmitidos ao caller
        data: dados,
        //Define o formato da resposta, OBRIGATORIAMENTE JSON
        dataType: 'json',
        //Define para sucesso da transmissão -> 
        success: function (data)
        {
          	//Aqui devolve pra chamada do método no evento disparador.
            callback(data);   
        }
    });
}

 

Isso é necessário porque o método da requisição, é global, todos os eventos usam o mesmo método, possuem o mesmo formato de leitura de resposta.

 

Fiz assim porque não consigo retirar o retorno do ajax de dentro da resposta dele, nem com window.variavel , de nenhum outro jeito, o 'data' sai da requisição.

 

É correto usar desse modo ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

6 respostas a esta questão

Recommended Posts

Não é errado, está de acordo com o efeito de uma requisição assíncrona. Você pode ler mais aqui: https://stackoverflow.com/a/14220323/1628790

 

Entretanto, eu mudaria a chamada do método para apenas receber o callback:

function metodo_da_requisicao(callback) { /** ... **/ }

E, se precisar utilizar o elemento anterior, utilize-se do escopo das variáveis:

var input = $(this);

metodo_da_requisicao(
    function(data) {
        input.attr("value" , data.value); //exemplo do uso do escopo
    }
);

Existem outras formas também, mas essa é a mais comun. Para mais informações: https://stackoverflow.com/a/20279485/1628790

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

Pena que a maioria dos respostas de coisas que não são muito corriqueiras estão em inglês, leva um bom tempo pra entender direitinho kk

 

Acho que no caso que eu to usando não da pra não passar o $this pelo parametro, eu preciso do $(this) livre, pois a primeira etapa antes da requisição é dando um loop pelos elementos  '.input_field', e esses elementos eu encontro com um $this.closest('form').find('.input_field'), e aí o $(this) precisa estar livra pra interagir dentro do loop, mas vou tentar dessa forma que me indicou.

 

Obrigadão @Gabriel Heming!!

Compartilhar este post


Link para o post
Compartilhar em outros sites
3 minutos atrás, AnthraxisBR disse:

Acho que no caso que eu to usando não da pra não passar o $this pelo parametro, eu preciso do $(this) livre, pois a primeira etapa antes da requisição é dando um loop pelos elementos  '.input_field', e esses elementos eu encontro com um $this.closest('form').find('.input_field'), e aí o $(this) precisa estar livra pra interagir dentro do loop, mas vou tentar dessa forma que me indicou.

 

Isso não fez muito sentido pra mim.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tipo, eu recebo o pedido da requisição, aí faz isso dentro do método que vai devolver o callback:

 

//Buscando os campos
var inputs = $this.closest('.easy_form').find('.input_field');
inputs.each(function (a) {
        //Pegando o nome do campo
        var field = $(this).data('field');
        //Verificando o tipo de campo para validação
        var type = $(this).data('input-type');
        /*Verificando a camada de interação que o input está relacionado
         * OBservaçao: Os inputs podem estar dispostos em qualquer ordem no form.
         */
        var layer = $(this).data('field-layer');
        //Recebe o valor do input
        var value = $(this).val();
        //Concatena os dados usando o contador de input como base para dar a separação por '::' e por ',' corretamente.
        if (n_fields < a) {
            var concat = field + "::" + value + "::" + type + "::" + layer + ",";
        } else {
            var concat = field + "::" + value + "::" + type + "::" + layer;
        }
        //Faz p push na array
        data.push(concat);
    });

 

Se eu tento fazer como você disse:

 

var input = $(this);

 

Ele pega o método como $this, não o elemento que disparou o evento, aí ele não consegue achar onde estão os '.input_fields', ou talvez eu esteja fazendo algum coisa muito errada nessas trocas de informações.

 

Assim deu pra entender o problema ?

 

PS: do jeito que está funciona certinho, só to achando que esse não é o melhor modo de fazer isso D:

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

O nome input, foi apenas um exemplo. Utilizar:

var input = $(this);

É o mesmo que:

var $this = $(this);

Só muda a nomenclatura. E, olhando pelo contexto, é difícil de entender que $this não é referente ao contexto em questão (igual a $(this) e sim a outro elemento). É uma questão de nomenclatura.

 

Alias, a convenção o correto ainda, deveria ser "$" + "elemento", por se tratar de um objeto jQuery.

Por exemplo, o nome da classe que você usa para realizar o bind do evento é ".elemento", ou seja

var $elemento = $(this);

No final, é apenas uma questão de nomenclatura.

Compartilhar este post


Link para o post
Compartilhar em outros sites
1 minuto atrás, Gabriel Heming disse:

O nome input, foi apenas um exemplo. Utilizar:


var input = $(this);

É o mesmo que:


var $this = $(this);

Só muda a nomenclatura. E, olhando pelo contexto, é difícil de entender que $this não é referente ao contexto em questão (igual a $(this) e sim a outro elemento). É uma questão de nomenclatura.

 

Alias, a convenção o correto ainda, deveria ser "$" + "elemento", por se tratar de um objeto jQuery.

Por exemplo, o nome da classe que você usa para realizar o bind do evento é ".elemento", ou seja


var $elemento = $(this);

No final, é apenas uma questão de nomenclatura.

 

Nossa eu panguei totalmente, estava atribuindo a variável input ao $(this) , e logo a baixo atribuía o val() a mesma variável sobrescrevendo ela, por isso que ele não encontrava!!

 

Só mudei onde estava (errado)  :

 

Citar

var input = $inputs.closest('elemento) ~

 

para (deu certo):

 

Citar

var input_attrs = $inputs.closest('elemento) ~~

 

E mantive em cima:

 

Citar

var $inputs = $(this);

 

Problema resolvido!!

 

Brigadão!

 

 

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 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 Danilo - Jesus voltará!
      Olá pessoal, tenho uma div a qual através de um select categorias eu trago dados de empresas do banco, aí preciso clicar nas listagens das empresas e pegar o ID quando clica no checkbox e gravar pelo ajax novamente na session feita no arquivo php tipo um carrinho de compras, que essa parte já tenho... só não to conseguindo pegar os ids gerados dinamicamente no retorno feito do ajax, eles aparecem com F12 ao inspecionar, mas não aceita eu clicar para pegar o ID, acho que é algo de DOM, mas não to sabendo fazer... alguém aí saberia me ajudar como pegar esses ids ao clicar, já que eles vem dinamicamente?
       
      obrigado
    • Por joeythai
      Boa tarde pessoal,
       
      eu criei uma página da qual tenho diversos checkbox para marcar, se tiver alguma caixinha marcada eu habilito um botão para fazer o envio ao servidor, porém, está acontecendo um problema que não consegui identificar, o que está acontecendo é o seguinte:
       
      Quando eu marco um checkbox apenas, o botão é liberado, eu clico nele e aparece um modal para preencher os dados, e nesse modal tem um combobox com opções criadas em javascript, como tem somente uma caixinha marcada as informações no combobox aparecem perfeitamente, porém, se eu marco 2 checkbox ou mais as opções do combobox se repetem, como se eu tivesse fazendo isso dentro de um looping, o que não é verdade, eis o codigo abaixo:
       
      <code>
        <!DOCTYPE html>    <html lang="en">  
         <head>   <meta charset="UTF-8">   <meta http-equiv="X-UA-Compatible" content="IE=edge">   <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>Document</title>   </head>  
        <body>   <input id="check-belongings" class="custom-control-input check-belongings" name="" type="checkbox" value="">   <label for="" class="custom-control-label"></label>   <div class="col-12">   <div class="md-form mt-0 mb-0 pt-0 pb-0">   <label for="reason">Motivo</label><br><br>  
        <select class="form-control md-select2" style="width: 100%; text-transform: uppercase"   id="reason_all_belongings" name="reason_all_belongings" required>   </select>   </div>   </div>
       
        <script>  
         $('.check-belongings').click(function () {    let belongingsIds = [];    let listaMarcados;  
         let optionsReason = [];   let option = null;  
        let movementsSelect = document.getElementById("reason_all_belongings");  
        optionsReason = ['Conferencia', 'Desobstrução', 'Entrega ao Cliente/Propr','  Inspeção', 'Manobra', 'Venda'  ];  
        optionsReason.forEach((reason) => {   option = new Option(reason, reason.toLowerCase());   movementsSelect.options[movementsSelect.options.length] = option;   });  
        listaMarcados = document.getElementsByClassName("check-belongings");   for (let loop = 0; loop < listaMarcados.length; loop++) {   var item = listaMarcados[loop];  
         if (item.type == "checkbox" && item.checked) {    $('.drop-all-belongings').removeAttr('disabled');    belongingsIds.push(item.value);    } else { // $('.drop-all-belongings').attr('disabled', 'disabled');   }   }   });   </script>   </body>  
        </html> </code>
    • Por Carcleo
      Pessoal,  tenho uma janela popup que vai cobrar toda a tela.
      <div id="personal" class="personal">     <label>Quantas pedras deseja adquirir?</label>          <input type="number" name="rocks" id="rocks" required placeholder="1" max="200">     <a href="<?php echo route('client.buy.raffle',[1]); ?> "><h3>RESERVAR</h3></a> </div> onde tem [1] , no <a href
       
      preciso alterar via JavaScript para o valor colocado no input no momento do clique
       
      Será que tem jeito?
×

Informação importante

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