CODEWITHSUNDEEP
javascriptphpjqueryhtml
Tweath
Tweath

Reputation: 134

Checkbox checked add to cart

So I'm having some issues with my cart. Some jQuery issues and I was wondering if someone could point me in the right direction.

Thing is that I'm trying to make the cart more dynamic, if you check in a checkbox the item gets added to the cart and the total price and discount for that item is shown too.

Just having trouble with the checkbox part.

$(document).ready(function($){
    $('#cart_listing .quantity').change(function (event) {
        $quan = $(this);
        console.log($quan.parent().next()[0]);
        $quan.parent().next().find('.price').text(function () {
            return $quan.val() * parseInt($(this).attr('data-val'), 10) + ' €';
        });
            var total = 0;
            $('#cart_listing .price').each(function(k, v){
                total += parseFloat($(v).text(), 10); 
            });

            $('#cart_listing .faster').text(function () {
                faster = parseInt($(this).attr('data-val'), 10);
                return $(this).attr('data-val' + ' €');
            });

            var discount_pct = parseInt($("#cart_listing .discount").data("val"), 10);
            var discount = -(total * discount_pct/100);

            $('#cart_listing .discounted').text('-' + -discount + ' €');
            $('#cart_listing #total').text(total + discount + faster + ' €')
    });
});

jsFiddle: http://jsfiddle.net/ooh43u6t/

Upvotes: 0

Views: 2232

Answers (1)

sulavvr
sulavvr

Reputation: 276

I don't understand your question correctly, but I think you want to add the value for the checkbox when checked using jQuery. 

$('input[type=checkbox]').click(function(){
     if($(this).is(':checked')){ //use this to see if the checkbox is checked or not
         //do something...
     }
});

I don't know if you wanted something like this. If not, can you clarify more? Thanks!

Edit:

So, you basically use the same thing, something like this perhaps,

if($(this).is(':checked')){
    console.log($(this).parent('td').siblings('td').html()); // check this, you'll have the item name. (the first td)
    console.log($(this).attr('data-val')); // this will have the value on the "data-val" attribute on your checkbox
}

So, now you have the name of the product (1st log) and the price (2nd log). Now keep in mind that this would work only if the format is going to be consistent, and also instead of doing a generic input[type=checkbox], you might want to give all the product checkboxes a unique class, so it doesn't interfere with other checkboxes you might have. Hope this helps. If not, I'd be happy to answer some more. Thanks!

Upvotes: 2

Related Questions