Como adicionar uma classe no botão da paleta que eu clicar em "curtir"?
Por exemplo, eu tenho várias paletas de cores, mas quando clico em curtir, todos os botões recebem a classe .red
, eu queria que apenas no que eu cliquei recebesse a classe:
Meu HTML:
<form method="post" id="like">
<div class="form-group">
<input type="hidden" name="id" value="<?=$row->id?>" class="form-control">
</div>
<div class="form-group">
<input type="hidden" name="url" value="<?=Url::urlBase('palette/ajax/like')?>" class="form-control">
</div>
<button type="submit" name="submit" class="btn btn-light btn-sm">
<i class="fas fa-heart"></i> <?=$row->likes?>
</button>
</form>
O meu código ajax:
$('form#like').submit(function (e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: $('#like input[name=url]').val(),
data: $(this).serialize(),
dataType: 'json',
success: function (response) {
if (response.success) {
$('#like button[name=submit]').addClass('red')
}
}
});
});
E aproveitando o tópico, gostaria de saber também como posso manter a classe red ativa mesmo se der reload na página? Já que eu não estou utilizando um sistema de login, aqui todos que entrarem no site podem dar os likes. Futuramente irei fazer pra descurtir.