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 gersonab
      bom dia
      tenho uma aplicação onde gero um arquivo em pdf, gostaria de recuperar a url do pdf q foi criado, pois quando este é criado ele abre automaticamente e ou ja faz o download do mesmo, preciso da url para enviar para outros.
      <button type="button" class="btn btn-outline-primary" onclick="createPDF();">Imprimir</button> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.4.1/jspdf.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/canvas2image@1.0.5/canvas2image.min.js"></script> <script language="javascript"> (function($){ $.fn.createPdf = function(parametros) { var config = { 'fileName':'html-to-pdf' }; if (parametros){ $.extend(config, parametros); } var orig = $(this); var widthOrig = $(orig).width(); $(orig).width(900); var quotes = document.getElementById($(orig).attr('id')); html2canvas(quotes, { onrendered: function(canvas) { var pdf = new jsPDF('p', 'pt', 'letter'); for (var i = 0; i <= quotes.clientHeight/900; i++) { var srcImg = canvas; var sX = 0; var sY = 900*i; var sWidth = 900; var sHeight = 900; var dX = 0; var dY = 0; var dWidth = 900; var dHeight = 900; window.onePageCanvas = document.createElement("canvas"); onePageCanvas.setAttribute('width', 900); onePageCanvas.setAttribute('height', 900); var ctx = onePageCanvas.getContext('2d'); ctx.drawImage(srcImg,sX,sY,sWidth,sHeight,dX,dY,dWidth,dHeight); var canvasDataURL = onePageCanvas.toDataURL("image/png", 1.0); var width = onePageCanvas.width; var height = onePageCanvas.clientHeight; if (i > 0) { pdf.addPage(612, 791); } pdf.setPage(i+1); pdf.addImage(canvasDataURL, 'PNG', 20, 40, (width*.62), (height*.62)); // Retirar o comentário caso queira ver como está sendo gerado o canvas. //document.body.appendChild(onePageCanvas); } pdf.save(config.fileName); $(orig).width(widthOrig); } }); }; })(jQuery); function createPDF() { $('#renderPDF').createPdf({ 'fileName' : '<?php echo $usercli['idocl']; ?>' }); }  
    • Por gersonab
      Boa tarde a todos.
      tenho pesquisado e ainda não encontrei uma forma de montar uma imagem online, tipo, tenho uma área de 400px por 400px , nesta gostaria de acrescentar algumas imagens que já tenho, tipo clicar e arrastar para dentro, sendo que estas imagens já se encontram online no site, seria mais ou menos assim : poderia colocar dentro desta área uma imagem do gato , do cachorro e ou outra. Não sei qual biblioteca ou forma de fazer.
      gostaria da ajuda para iniciar, desde já agradeço.
    • 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
×

Informação importante

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