Using JQuery ajax to call a PHP file, process, but stay on same page

Question

This code is working (as is) on a live site. I am attempting to run it on localhost via XAMPP but addToCart.php is not being called.

Wondering if there's a better way to write this so it is more robust and will work on localhost config as well. I am not very familiar with JQuery or PHP, as may be obvious from the code.

<a id="atcAnchorTag'.$thisProduct['id'].'" 
href="#" 
onclick="
jQuery.ajax(\'./addToCart.php?id='.$thisProduct['id'].'\');
jQuery(atcAnchorTag'.$thisProduct['id'].').hide();
jQuery(rfcAnchorTag'.$thisProduct['id'].').show();
jQuery(mt'.$thisProduct['id'].').hide();
jQuery(grn'.$thisProduct['id'].').show();
scItemsCountJS++ ;
return false ; "
style="display:'.$atcDisplayType.'">add to cart</a>

Ehhh, why is this all inline? Put this into a JavaScript file and store all of the info you need stored in an element with data- attributes. That way, you can attach your onclick stuff via an event handler. — Blender
– Blender, Commented Jun 14, 2012 at 5:04
Sorry to ask but I need some help with this. How would I re-write the above code to do what you suggest? I'm not yet sufficiently advanced to follow your directions without an example. — cssyphus
– cssyphus, Commented Jun 14, 2012 at 5:26
I don't think there's much you can do to "fix" this code, as it would require you to restructure quite a lot of things. How do you know that the AJAX call isn't running? — Blender
– Blender, Commented Jun 14, 2012 at 5:28
If I type localhost/addToCart.php?id=2 in the browser address bar, then a product is added to the cart. Just clicking the "add to cart" link makes pretty jQuery events happen (show/hide) but nothing is added to the cart. — cssyphus
– cssyphus, Commented Jun 14, 2012 at 5:31

cssyphus · Accepted Answer · 2012-08-21 17:35:09Z

Actually, Blender was correct and I would credit him with the answer if there was a way to do so. Rewriting the code as he suggested turned out not to be very difficult but it took a long time to figure it out myself.

Here is what worked. HTML:

<a id="atcAnchorTag'.$thisProduct['id'].'" 
    href="#" 
    style="display:'.$atcDisplayType.'">
    add to cart
</a>

JQuery:

<script type="text/javascript">
    $("#atcAnchorTag'.$thisProduct['id'].'").click(function() { 
        //alert("Hello");
        jQuery(atcAnchorTag'.$thisProduct['id'].').hide();
        jQuery(rfcAnchorTag'.$thisProduct['id'].').show();
        jQuery(mt'.$thisProduct['id'].').hide();
        jQuery(grn'.$thisProduct['id'].').show();
        scItemsCountJS++ ;
        var prodid = '.$thisProduct['id'].';
        $.post("addToCartJQ.php", {id: prodid}, function() {
        });
    });
</script>

Collectives™ on Stack Overflow

Using JQuery ajax to call a PHP file, process, but stay on same page

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related