Entrar Ainda não tem acesso?
2
respostas

Limpando o pedido

Referente ao curso Cordova & PhoneGap: Apps mobile com HTML, CSS e JS, no capítulo Mais Material Design e atividade Limpar pedido

por William Rodrigues da Silva
| 19.4k xp | 7 posts
Desenvolvedor

Estou tentando fazer uma implementação diferente para limpar o pedido e não estou conseguindo.

Ao clicar em um 'badge' eu quero decrementar o número ao invés de limpar todo ele.

Três pontos:

  • Por que estou precisando utilizar o literal '2' para decrementar ao invés de '1'
  • Consigo decrementar, mas o 'badge' fica com valor negativo quando seu valor chega a zero e eu clico novamente nele.
  • Não consegui fazer uma validação com if para que quando o 'badge' chegar ao valor igual a zero, aí sim eu remove o 'badge'

Meu código para o decremento é este abaixo. Se eu coloco -1 não funciona.

$('.collection').on('click', '.badge', function(){

    //$(this).remove();
    $(this).text(parseInt($(this).text()) - 2);

    return false;
});

Alguma dica?

2 respostas
por Andre Nardy
| 353.6k xp | 19 posts

William,

Veja se esse código te ajuda

$('.collection').on('click', '.badge', function(){

    var num = parseInt($(this).text(),10);
    if (num > 0) {
        $(this).text(num - 1);
    } else {
        $(this).remove();
    }

    return false;
});
por William Rodrigues da Silva
| 19.4k xp | 7 posts
Desenvolvedor

Sem chance.

Ficou com os mesmos problemas:

1 - Se eu deixo num - 1, nada acontece. Tenho que colocar num -2 para decrementar corretamente.

2 - O valor fica negativo ainda após chegar no zero.

Acredito que uma function está conflitando com a outra, pois a mensagem de adicionado também aparece quando decrementa. E talvez por isto eu tenha que utilizar -2 ao invés de -1. Estou pensando em uma forma de solucionar. Enquanto isto segue aqui o código das duas functions: a que adiciona e a que decrementa.

Adicionando:

$('.collection-item').on('click', function(){
    var $badge = $('.badge', this);
    if ($badge.length == 0) {
        $badge = $('<span class="badge brow-text">0</span>').appendTo(this);
    }

    $badge.text(parseInt($badge.text()) + 1);

    var produto = this.firstChild.textContent;
    Materialize.toast(produto + ' adicionado', 1000);

});

Decrementando:

$('.collection').on('click', '.badge', function(){

    var num = parseInt($(this).text(),10);
    if (num >= 1) {
        $(this).text(num - 2);
    } else {
        $(this).remove();
    }
    return false;
});