Как каждый чекбокс записывать в итоговую стоимость отдельно?

Я делаю онлайн калькулятор расчёта стоимости для сайта. Нажимая на чекбоксы, пользователь выбирает размеры, эти данные попадают в итоговую стоимость через функцию:

function updatePrice() {
  let kraskaPrice = currentSet.getKraskaPrice();
  let dopPrice = currentSet.getDopPrice();
  let selsgPrice = currentSet.getSelsgPrice();
  let selspPrice = currentSet.getSelspPrice();
  let sellgPrice = currentSet.getSellgPrice();
  let sellpPrice = currentSet.getSellpPrice();
  let totalPrice = currentSet.dlina + currentSet.kolichestvo + kraskaPrice + dopPrice + selsgPrice + selspPrice + sellgPrice + sellpPrice;
  total.value = totalPrice;
}

Сейчас все чекбоксы между собой суммируются, а мне нужно чтобы суммировался только один из этих чекбоксов (selsgPrice, selspPrice, sellgPrice, sellpPrice) с currentSet.dlina, currentSet.kolichestvo, kraskaPrice и dopPrice.

Я представляю конструкцию вида:

function updatePrice() {
  let kraskaPrice = currentSet.getKraskaPrice();
  let dopPrice = currentSet.getDopPrice();
  let selsgPrice = currentSet.getSelsgPrice();
  let selspPrice = currentSet.getSelspPrice();
  let sellgPrice = currentSet.getSellgPrice();
  let sellpPrice = currentSet.getSellpPrice();
  let totalPrice = currentSet.dlina + currentSet.kolichestvo + kraskaPrice + dopPrice + (selsgPrice, selspPrice, sellgPrice, sellpPrice);
  total.value = totalPrice;
}

Но это не работает. Подскажите, как это реализовать? Ссылка на весь мой код: https://codepen.io/till728/pen/vYrmOJy

Калькулятор


Ответы (1 шт):

Автор решения: HardlinePeak

Посмотрев ваш код и немного поэкспериментировав я понял три вещи:

  • У вас неправильные значения в let currentSet у sellp, sellg, selsp и selsg, замените это:
let currentSet {
    // Значения
    selsg: "711",
    selsp: "915",
    sellg: "790",
    sellp: "1075",
    // Ещё значения
};

на это:

let currentSet {
    // Значения
    selsg: "sg50",
    selsp: "sp5050",
    sellg: "lg50",
    sellp: "lp5050",
    // Ещё значения
};
  • Вам не подходит выбор минимального значения из selsgPrice, selspPrice, sellgPrice и sellpPrice, лучше сделать как-то так:
let lastPrice = 0;
function kraskaUpdate(e) {
    currentSet.kraska = e.target.id;
    updatePrice();
}

function dopUpdate(e) {
    currentSet.dop = e.target.id;
    updatePrice();
}

function selsgUpdate(e) {
    currentSet.selsg = e.target.id;
    lastPrice = currentSet.getSelsgPrice();
    updatePrice();
}

function selspUpdate(e) {
    currentSet.selsp = e.target.id;
    lastPrice = currentSet.getSelspPrice();
    updatePrice();
}

function sellgUpdate(e) {
    currentSet.sellg = e.target.id;
    lastPrice = currentSet.getSellgPrice();
    updatePrice();
}

function sellpUpdate(e) {
    currentSet.sellp = e.target.id;
    lastPrice = currentSet.getSellpPrice();
    updatePrice();
}

function dlinaUpdate(e) {
    currentSet.dlina = dlina.value;
    volume5.value = currentSet.dlina;
    updatePrice();
}

function kolichestvoUpdate(e) {
    currentSet.kolichestvo = kolichestvo.value;
    volume6.value = currentSet.kolichestvo;
    updatePrice();
}

function updatePrice() {
    let kraskaPrice = currentSet.getKraskaPrice();
    let dopPrice = currentSet.getDopPrice();
    let selsgPrice = currentSet.getSelsgPrice();
    let selspPrice = currentSet.getSelspPrice();
    let sellgPrice = currentSet.getSellgPrice();
    let sellpPrice = currentSet.getSellpPrice();
    let totalPrice = currentSet.dlina + currentSet.kolichestvo + kraskaPrice + dopPrice + lastPrice;
    total.value = totalPrice;
}
  • codepen.io ужасен при работе с телефона :)
→ Ссылка