How to save changed values ​​after page reload?

Question

PHP

Hello. Site on 1C-Bitrix, on the detailed page of the product there is a link "Add to cart" when clicked, the product is added to the cart. It is necessary after clicking to change the text "Add to cart" to "In cart" and change the link.
Thus, I will change the text and href value:

$('.add__tocart').click(function() {
  $(this).text('В корзине');
  $(this).href('/cart/');
  return false;
});

Everything works, but adding a product occurs with a page reload and as a result nothing changes. How can I change the values ​​and after reloading the page they are saved?

Answer 1

Updating the label on the button on click is one thing. In general, it is logical for you to either send to the basket via AJAX, or the label on the button should change the server when the page is reloaded. After all, he knows that this product is in the basket.
You do not need to save the status at all.

Answer 2

js has nothing to do with it. Process on the server side and display the desired link depending on the availability of goods in the basket

Answer 3

jQuery-Session-Plugin
as an option

$('#addItem').on('click', function(event) {

  var cartItems = $.session.get('cartItems');
  if (!cartItems) cartItems = [];

  var newItem = getNewItem();
  cartItems.push(newItem);

  $.session.set('cartItems', cartItems);
});

jQuery(document).ready(function($) {
  
  var cartItems = $.session.get('cartItems');
  if (!cartItems) cartItems = [];

  console.log(cartItems);
});

Answer 4

The author, Alexei Tsarapkin and Alexei Skobkin are telling you right. Even if you do as erniesto77 suggests , you still have to parse data from the array into the PHP handler using AJAX.
Therefore, it is better to immediately make this handler on the page for adding goods to the cart

(function($){
$(document).on('click', '.add__tocart', function( event ) {
  event.preventDefault();
  var _self = $(this);
  if( xhr ) xhr.abort();
  var xhr = $.ajax({
   method: 'post',
   url: '/add_to_cart.php',
   success: function( response ) {
     if( response ) {
        _self.text('В корзине');
        _self.href('/cart/');
     }
   }
  });
});
}(window.jQuery);

Do not copy the code one to one. I wrote with a quick hand, on my knee.