Добавление курса доллара и расчет в калькуляторе

[Artemyi]

Подскажите пожалуйста новичку.
Есть такой простой калькулятор https://jsfiddle.net/rq1jtb7c/2/
1. как избавиться от "NaN" в результатах расчета калькулятора, который появляется, когда начинаешь вводить какие-нибудь параметры?
2. стоимость переменной "baget" дана в долларах. Как в этот калькулятор добавить текущий курс доллара?

Пытался использовать этот сайт https://www.cbr-xml-daily.ru/, но знаний не хватает, чтобы все правильно интегрировать

[Nexus]

1. как избавиться от "NaN" в результатах расчета калькулятора, который появляется, когда начинаешь вводить какие-нибудь параметры?

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

2. стоимость переменной "baget" дана в долларах. Как в этот калькулятор добавить текущий курс доллара?

Примерно так: https://jsfiddle.net/NexusDeveloper/8k6vwc59/5/

[laimas]

Artemyi, можно и нужно, исключить многочисленные if...else, если поступить одним из способов:
а) держать значения вариантов в data атрибутах опций, извлекая выбранное у выбранной опции
б) держать значения вариантов в массиве/объекте, извлекая выбранное по индексу/значению выбранной опции

[Artemyi]

Artemyi, можно и нужно, исключить многочисленные if...else, если поступить одним из способов:
а) держать значения вариантов в data атрибутах опций, извлекая выбранное у выбранной опции
б) держать значения вариантов в массиве/объекте, извлекая выбранное по индексу/значению выбранной опции

а) я предполагаю вы про атрибуты value в input. Так можно было бы, но в в них указываются выбранные варианты (например, доставка - да/нет), которая отправляется на почту.
б) не добрался до этого, да и раз работает - не трогаю)

[Artemyi]

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


Примерно так: https://jsfiddle.net/NexusDeveloper/8k6vwc59/5/

Расчет в долларах работает как нужно. Большое спасибо

[laimas]

я предполагаю вы про атрибуты value в input

Конечно же нет, я о списках, и вместо того чтобы плодить такие портянки в коде:

if (form.baget[0].selected) {
baget=0;  // стоимость вариантов = цена*курс доллара
}                                  
else if (form.baget[1].selected) {
baget=100;
}
else if (form.baget[2].selected) {
baget=110;
}
else if (form.baget[3].selected) {
baget=120;
}
else if (form.baget[4].selected) {
baget=130;
}
....

прописать значения для baget в соответствующие опции, то есть

<option data-baget="100" value="1">100<option>
<option data-baget="110" value="2">110<option>
и т.д.

Пример:

<select id="baget">
    <option data-baget="1" value="">Не выбран</option>
    <option data-baget="100" value="1">№1</option>
    <option data-baget="110" value="2">№2</option>
    <option data-baget="120" value="3">№3</option>
    <option data-baget="130" value="4">№4</option>
    <option data-baget="140" value="5">№5</option>
    <option data-baget="150" value="6">№6</option>										
</select>
<input id="val" />
<script>
document.getElementById('baget').addEventListener('change', function() {
    let baget = this.options[this.selectedIndex].dataset.baget;
    val.value = baget;
})
</script>

либо использовать массив/объект описывающий эти значения.

[Artemyi]

if (form.baget[0].selected) {
baget=0;  // стоимость вариантов = цена*курс доллара
}                                  
else if (form.baget[1].selected) {
baget=100;
}
else if (form.baget[2].selected) {
baget=110;
}
else if (form.baget[3].selected) {
baget=120;
}
else if (form.baget[4].selected) {
baget=130;
}
....

Был бы премного благодарен, если вам не сложно, более подробно показать, как это мне прописать в моем калькуляторе?

[laimas]

если вам не сложно, более подробно показать, как это мне прописать в моем калькуляторе

Можно было бы и конкретно по калькулятору, но мы уже неделю страдаем от изнывающей жары, и даже лишний раз языком и то пошевелить лень. Поэтому просто пояснение, вникните и сделайте согласно ему. Это несложно для понимания.

В примере видно, что значения для расчета прописываются в data атрибутах, в данном случае это в атрибутах опций - data-baget. У первой опции значение я прописал равным 1. Например, если в списке этом выбрана эта опция (то есть не было выбора варианта), а это значение списка будет операндом в операции умножения, то значение 1 не повлияет на результат. Вы можете другое значение подставить, например 0, если будет сложение, либо вообще не добавлять такого атрибута этой опции, если операция производится только при выборе варианта.

А далее, в функции расчета вы же получаете ссылку на список, а далее получить значение baget у выбранной опции, например:

//это список вариантов
var opt = document.getElementById('baget');
//а это значение baget выбранной его опции полученной из ее атрибута data-baget
var baget = opt.options[opt.selectedIndex].dataset.baget;
//далее это полученное значение подставляется в расчет

У вас не один список этот, и для второго можно и нужно поступить также, зачем разводить портянки в коде.

Думайте, пробуйте, а не получится тогда ..., но сегодня я точно не буду ходить по сайтам, что-то там смотреть и т.д.

[Artemyi]

//это список вариантов
var opt = document.getElementById('baget');
//а это значение baget выбранной его опции полученной из ее атрибута data-baget
var baget = opt.options[opt.selectedIndex].dataset.baget;
//далее это полученное значение подставляется в расчет

Вроде допилил, все работает.
Большое спасибо