单击链接后警报不显示

Question

I have created a Buy Now link that pulls the URL from my phpmyadmin database. Clicking the link adds the product to the cart but I would not like the user to go to checkout when they click the link, but instead stay on the same page and pop an alert saying 'Product was added to cart'. Below is my current script but the alert does not show up and the user goes to the link. Can anyone tell me what is wrong? Thanks!

<script>
    $("#shop").onclick(function(event){
        $.post( '" . $producturl[0]->URL . "' );
        event.preventDefault();
        event.stopPropagation();
        console.log('Added To Cart');
    });
</script>


<?php $producturl = ProductURL::find(array('Product'=>$tube1->Tube1));
    if($producturl[0]->URL!=NULL){
        echo '<a href="' . $producturl[0]->URL . '" data-role="button" data-inline="true" data-mini="true" data-theme="d" target="vspage" onclick="' . "_gaq.push(['_trackEvent', 'Buy Now', 'Tube', '" . $tube1->Tube1 . "'" . "]); _gaq.push(['_link', '" . $producturl[0]->URL . "']);" . '" id="shop">Test Cart</a>';

        echo '<a href="#" id="shop">Test2 Cart</a>';
    }
?>

$producturl[0]->URL is the array that pulls the current product to cart from phpmyadmin

Answer 1

Try deleting the anchor so your text is no longer a link, then make it a span with the shop id:

<?php $producturl = ProductURL::find(array('Product'=>$tube1->Tube1));

        if($producturl[0]->URL!=NULL){
            echo '<span id="shop">Test Cart</span>';
        }
?>

Answer 2

Use

window.alert('Added To Cart') 

instead of

console.log('Added To Cart')

Answer 3

You should have jQuery and change to:

    $( document ).ready(function() {
        $("#shop").click(function(event){ 

          event.preventDefault();

          // Your code here

          // Alert user
          alert('Added To Cart'); 

       });
   });

And you should have only one unique id on same page! You have two shop ids.

Update:

You have this too:

$.post( '" . $producturl[0]->URL . "' );

To use php variables in javascript you should echo them, like:

$.post( '<?php echo $producturl[0]->URL;?>' );

I don't know what that $producturl[0]->URL variable have it, but this is not enought to update your cart, maybe you don't need this $.post to if you don't want to make anything from server side right now... perhaps you just want to update customer cart, like total price, quantity, add the new product...

But if you really need to do something from server side at this moment, check $.post documentation HERE

Answer 4

<?php $producturl = ProductURL::find(array('Product'=>$tube1->Tube1));
    if($producturl[0]->URL!=NULL){      
echo '<a href="#shop" id="shop">Test2 Cart</a>';
}
    ?>

<script type="text/javascript">
$(document).on('click', '#shop', function (event) {
$.post( '" . $producturl[0]->URL . "' );
event.stopPropogation();
event.preventDefault();
alert('Product has been added to cart');
});
</script>

This is my current code now where the alert finally pops up but the cart itself when I go to the page does not update. I used $.post , any help for this last step woud be great!