mootools:faça retornos de chamada ajax para trabalhar com o elemento clicado
-
21-12-2019 - |
Pergunta
Suponha que eu tenha vários links vermelhos e queira adicionar um evento de clique a eles de forma que, quando disparado, ele envie o atributo HREF do link para o servidor (como uma solicitação AJAX) e, em caso de sucesso, a cor do link será alterada para verde.Eu quero algo como:
$$('a.red').addEvent(
"click",
function () {
new Request.JSON({
url: 'script.php',
onSuccess: function(){
[the link wich is clicked].setStyle('color', 'green');
return false;
}
}).get("url="+[url of the link]);
}
);
Desculpe se a pergunta é boba.por favor edite o título para algum sensato.
Solução
O problema aqui é que this
dentro do manipulador de eventos não é o mesmo que this
dentro da classe de solicitação.Então, o que geralmente é feito é mudar a referência para this
em uma nova variável, por exemplo var self = this
.
Depois disso você pode usar self.setStyle('color', 'green');
Aliás, uma sugestão, o melhor seria ter também uma classe para a cor verde e trocá-las na hora do clique.
Então aqui está uma sugestão de código que seria:
$$('a.red').addEvent("click", function (event) {
var self = this;
event.stop();
new Request.JSON({
url: 'script.php',
onSuccess: function () {
self.removeClass('red').addClass('green');
return false; // I added event.stop(), presume that is what you meant. Do this line can be removed
}
}).get("url=" + self.href);
});
e usando no CSS algo como:
.green {
color: green;
}