Ajax how to post to an array

Question

I would like to post to 'add', which also holds the attribute of size, quantity, color, and price, without refreshing the page. How can I do this?

example.php

// Add item
if (isset($_POST['add'])) {
    foreach ($products as $product) {
        if ($_POST['id'] == $product->id) {
            break;
        }
    }

    $cart->add($product->id, $_POST['qty'], [
        'price' => $product->price,
        'color' => (isset($_POST['color'])) ? $_POST['color'] : '',
        'size' => (isset($_POST['size'])) ? $_POST['size'] : '',
    ]);

}

here is the code I have so far to post to 'add' without refreshing but not sure if its correct.

$('.add-to-cartnon').on('click', function(){

var $btn = $(this);
var id = $btn.parent().parent().find('.product-id').val();
var color = $btn.parent().parent().find('.color').val() || '';
var qty = $btn.parent().parent().find('.quantity').val();
var size = $btn.parent().parent().find('.size').val() || '';
var add= $btn.parent().parent().find('.add').val() || '';


$.ajax ({
    method: 'post',
    url: 'example.php',
    data: {             
        id: id,
        color: color,
        qty: qty,
        size:size,
        add:add
    },
    success: function(data) {

    }
});

I can make this work if i wanted to post and refresh by adding :

var $form = $('<form action="?a=cart" method="post" />').html('<input type="hidden" name="add" value=""><input type="hidden" name="id" value="' + id + '"><input type="hidden" name="color" value="' + color + '"><input type="hidden" name="size" value="' + size + '"><input type="hidden" name="qty" value="' + qty + '">');

$('body').append($form);
$form.submit();

Your code seems fine. What is the issue? If you need to debug AJAX calls then check out http://stackoverflow.com/a/21617685/2191572 — MonkeyZeus, May 10 '18 at 11:59
If anything, the code has a logic issue. Try putting `$cart->add(` right before `break;` — MonkeyZeus, May 10 '18 at 12:02
I dont think so, because i can get this to work if i to refresh and post this as a form. I'll provide an example of what i mean — moleeee, May 10 '18 at 12:06

Girish Ninama · Answer 1 · 2018-05-10T12:36:01.230

0

$('.add-to-cartnon').on('click', function () {

    var $btn = $(this);
    var id = $btn.parent().parent().find('.product-id').val();
    var color = $btn.parent().parent().find('.color').val() || '';
    var qty = $btn.parent().parent().find('.quantity').val();
    var size = $btn.parent().parent().find('.size').val() || '';

    var dataArray = {id: id, color: color, qty: qty, size: size};

    $.ajax({
        method: 'post',
        url: 'example.php',
        data: {
            add: dataArray
        },
        success: function (data) {
        }
    });
});

edited May 10 '18 at 12:36

answered May 10 '18 at 12:08

Girish Ninama

583
4
8

2

No need to SHOUT at the OP – RiggsFolly May 10 '18 at 12:12
ok i got it in your AJAX code you are not passing any varible value " add " so it will generate error u can see in console or network of browser data: { id: id, color: color, qty: qty, size:size, add:add // please make sure u are passing value of add variable }, – Girish Ninama May 10 '18 at 12:15
it just doesnt post the attributes (qty,color, size) to the 'add' array – moleeee May 10 '18 at 12:17
just remove add:add this – Girish Ninama May 10 '18 at 12:19
actually i need the add otherwise whats it going to post to? i just need to post the attributes (qty,color, size..) in the add array. – moleeee May 10 '18 at 12:23
@moleeee u cant delete add:add parameter from ajax data cause in example.php u are using as isset ($_post["add"]) just change like add : 'add' – Girish Ninama May 10 '18 at 12:23
when i click the '.add-to-cartnon' button. it creates an array but doesnt store the attributes (qty,color, size) to it – moleeee May 10 '18 at 12:25
change code to this u will get all data in $_POST['add'] var dataArray = {id: id,color:color,qty: qty,size: size}; $.ajax({ method: 'post', url: 'example.php', data: { add: dataArray }, success: function (data) { } }); – Girish Ninama May 10 '18 at 12:34

Ajax how to post to an array

1 Answers1