Динамически обновлять соответствующую цену при выборе размера

Question

В моем интернет-магазине большой размер может быть дороже маленького.Поэтому, когда пользователь выбирает свой размер, я бы хотел обновить цену в показе товара.

По умолчанию я отображаю цену Продукта.Размер варианта может иметь другую цену ...

Вот моя форма, в моей выставке продуктов.

<h4 id="product_price"><%= number_to_currency_euro @product.price %></h4>
  <%= form_tag admin_sale_items_path , input_html: {id: "salesform"} do %>
    <%= hidden_field_tag :product_id, @product.id %>
    <%= hidden_field_tag :user_id, @token %>
    <%= hidden_field_tag :quantity, 1 %>
      <%= select_tag :variant_id, options_from_collection_for_select(@product_size_options, :id, :size_and_color_stock), class: 'custom-select variant', required: true %>

    <%= submit_tag, class: "btn-main btn-block", id: "add_to_basket" %>
  <% end %>

Мне не нравятся jQuery и js, поэтому мне нужна ваша помощьс объяснением, пожалуйста :)

вот моя попытка

$('#salesform').bind(".variant").bind('ajax:success', function(){
    $('#product_price').html("<%= #the variant price %>");
});

Как мне извлечь выбранный размер, чтобы использовать его и найти его цену?

Answer 1

похоже, вы не написали ни одного вызова метода ajax.Попробуйте написать Ajax-вызов, как это,

$.ajax({
data : DATA_YOU_WANT_TO_PASS_TO_URL,
url : https://DATA-PROVIDER-URL,
success : function (data){
$('#product_price').html("<%= #the variant price %>");
// YOUR OTHER LOGIC for success handler
}