Make AJAX call from <a href> click using attribute as a variable

Question

I have a link

<a id="container" value="{$variable}" href="#">Click This</a>

That I would like to use to POST via an AJAX call.

Here is my code.

$('#container').click(function(event){
   event.preventDefault();
   $.post('/cart.php?mode=add&productid={$variablegoes here}&amount=1&redirect_from_cart=Y', function(response){
      alert(response);
   });
});

Alexander O'Mara · Accepted Answer · 2016-12-20 06:47:40Z

3

Easy, just read the attribute, encode with encodeURIComponent, and concatenate the value into the string.

$('#container').click(function(event){
    event.preventDefault();
    var variable = $(this).attr('value');
    $.post('/cart.php?mode=add&productid=' + encodeURIComponent(variable) + '&amount=1&redirect_from_cart=Y', function(response){
        alert(response);
    });
});

The a tag does not normally have a value attribute however, so I would recommend using a data attribute instead to keep the HTML nice and valid.

<a id="container" data-value="{$variable}" href="#">Click This</a>

$('#container').click(function(event){
    event.preventDefault();
    var variable = $(this).attr('data-value');
    $.post('/cart.php?mode=add&productid=' + encodeURIComponent(variable) + '&amount=1&redirect_from_cart=Y', function(response){
        alert(response);
    });
});

edited Dec 20, 2016 at 6:47

answered Dec 20, 2016 at 6:31

Alexander O'Mara

60.9k19 gold badges176 silver badges184 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Make AJAX call from <a href> click using attribute as a variable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related