Перейти к содержанию
Официальный форум поддержки Simpla

подсчет общей суммы в карточке товара


Рекомендуемые сообщения

Друзья, в карточке товара выбор товара идет с помощью select.

Цена при выборе изменяется с помощью 

 

$('select[name=variant]').live('change', function(){
    price = $(this).find('option:selected').attr('data-price');
    compare_price = $(this).find('option:selected').attr('data-compare-price');
    $(this).closest('form.variants').find('.price span').html(price);
    $(this).closest('form.variants').find('.compare_price').html(compare_price);
    return false;
});	

Дальше идет input с возможностью выбора количества товара 

 

	<div class="count">
	<input class="amount" type="text" name="amount" value="1">
	<span class="plus"></span>   
        <span class="minus"></span>
	</div>


              $('.minus').click(function () {
                var $input = $(this).parent().find('.amount');
                var count = parseInt($input.val()) - 1;
                count = count < 1 ? 1 : count;
                $input.val(count);
                $input.change();
                return false;
            });
            $('.plus').click(function () {
                var $input = $(this).parent().find('.amount');
                $input.val(parseInt($input.val()) + 1);
                $input.change();
                return false;
            });

Сейчас работает все как нужно, но потребовалось вывести общую сумму в

 

<div class="total_price"></div>

Получается поле изначально имеет цену товара, при смене варианта товара select цена меняется на текущую цену варианта.

Дальше при клике plus или minus меняется значение input и расчитывается цена исходя из цена варианта*количество.

 

Подскажите как реализовать данную задачу, заранее спасибо.

Ссылка на сообщение
Поделиться на другие сайты

мда. уроки по JS  посмотри складывание и перемножение сумм

 

Вопрос стоит как это оптимизировано сделать а не городить кучу функций.

Ссылка на сообщение
Поделиться на другие сайты

Вопрос стоит как это оптимизировано сделать а не городить кучу функций.

 

те ты хочешь функцию умножения заменить на какую функцию?))

Ссылка на сообщение
Поделиться на другие сайты

те ты хочешь функцию умножения заменить на какую функцию?))

 

Ладно, любите вы тут писать " читайте мат часть" , " учите основы js ". Не опускайтесь до уровня Нокстера, я знаю вы хороший человек.

 

Те функции что я выше написал были взяты  с данного форума, и вопрос был стоит ли их как то оптимизировать, например  не создавать 2 функции click  .plus и .minus. 

Вместо этого написали чтоб сложил ( умножил) и нормуль. Если не сложно посмотрите данный вариант (может что посоветуйте поправить), работает все как нужно.

 

2 основных момента - убрал live метод. ( он вроде уже не используется) и 

навешал на кнопки plus munus аттрибуты data-change="+1" и data-change="-1"

 

При выборе варианта или изменении количества товара сумма в поле .total_price пересчитывается.

 

 

function calcSum() {
  const
    price = $('[name="variant"] option:checked').data('price').replace(',', '.'),
    amount = $('[name="amount"]').val();
  $('.total_price').text((price * amount).toFixed(2).replace('.', ','));
}
$('[name="variant"]').on('change', function() {
  $('.price.prc-new span').text($(this).find('option:checked').data('price'));
  calcSum();
});
$('[name="variant"]').on('change', calcSum);
$('[data-change]').click(function() {
  const
    change = +$(this).data('change'),
    $amount = $('[name="amount"]');
  $amount.val(Math.max(1, +$amount.val() + change));
  calcSum();
});
Ссылка на сообщение
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

Загрузка...
×
×
  • Создать...