Felipe Turquize
Felipe Turquize

Reputation: 51

Add products on shopping cart

Friends, I am developing an e-commerce website (using Codeigniter).

After the customer fill out the amount of products and click "Buy", only products with the field "quantity" are to be filled in cart. Can you help me?

HTML:

<form>
<ul class="products-list">
    <li class="product">
        <input type="hidden" class="product_id" value="1">
        <span class="product-name">Product 1</span>
        <span class="product-value">$ 100</span> 
        <span>Qnt. <input type="text" class="quantity"></span> 
    </li>
        <li class="product">
        <input type="hidden" class="product_id" value="2">
        <span class="product-name">Product 2</span>
        <span class="product-value">$ 100</span> 
        <span>Qnt. <input type="text" class="quantity"></span> 
    </li>
</ul>
<button>Buy</button>
</form>


jQuery:

$.ajax({
    url: '/cart/add/'+product_id+'/'+quantity,
    type: 'GET',
    success: function( data ){
        if ( data != false ) {
            window.location.reload();
        }
    }
});


My PHP Code:

public function addItem( $product_id, $quantity){ 
    $product = $this->Produto_model->getById($product_id); 
    $this->carrinho->setItem($product, $quantity); 
    echo json_encode($this->carrinho); 
}  

Upvotes: 0

Views: 1895

Answers (1)

user576126
user576126

Reputation:

Try like this

HTML:

<form id="form-cart">
    <ul class="products-list">
        <li class="product">
            <input type="hidden" class="product_id" value="1">
            <span class="product-name">Product 1</span>
            <span class="product-value">$ 100</span> 
            <span>Qnt. <input type="text" class="quantity" value="1"></span> 
        </li>
            <li class="product">
            <input type="hidden" class="product_id" value="2">
            <span class="product-name">Product 2</span>
            <span class="product-value">$ 100</span> 
            <span>Qnt. <input type="text" class="quantity" value="1"></span> 
        </li>
    </ul>
    <button id="form-cart-btn">Buy</button>
</form>


<script type="text/javascript">
    $("#form-cart #form-cart-btn").click(function(){
        form = $("#form-cart");

        items = [];

        form.find('li').each(function(i, e){
            _e  = $(e);
            qty = parseInt(_e.find('.quantity').val());

            if(isNaN(parseFloat(qty)) || ! isFinite(qty) || qty == 0)
                return;

            id = _e.find('.product_id').val();
            items.push('item[' + id + ']=' + qty);
        });

        items = items.join('&');

        $.ajax({
            url: '/cart/add/?' + items,
            dataType: 'json',
            success: function(response)
            {
                if(response.status != 'success')
                    return false;

                window.location.reload();
            }
        });
        return false;
    });
</script>

Cart Controller:

class Cart extends CI_Controller
{
    public function add()
    { 
        $items = isset($_GET['items']) ? $_GET['items'] : array();

        foreach($items as $product_id => $qty)
        {
            $product = $this->Produto_model->getById($product_id);
            if( ! $product)
            {
                ++$i;
                continue;
            }
            $this->carrinho->setItem($product, $qty);
            ++$i;
        }

        header("Content-type: application/json");
        echo json_encode(array('status'=>'success'));
        exit();
    }  
}

Upvotes: 0

Related Questions