Изменение скрытого значения Paypal в выпадающем списке

Question

У меня есть 2 выпадающих списка

Это часть формы для покупки рубашки с коротким или длинным рукавом через Paypal.

С коротким рукавом - одна цена. С длинным рукавом другая цена. Это прекрасно работает. Используя скрытые значения, я могу изменить цену рубашки с коротким рукавом 2XL и 3XL. Это прекрасно работает.

javascript используется для изменения цен на рубашки с длинным рукавом 2XL и 3XL. Это также прекрасно работает. У меня проблема с изменением значений option_select на «LS 2XL» или «LS 3xL» вместо «SS 2XL» или «SS 3XL» (вместе с остальными размерами с длинным рукавом).

Я не опытен в javascript, но обычно я могу собрать достаточно, чтобы все заработало. Это меня поставило в тупик. Любая помощь с использованием javascript будет принята с благодарностью.

function changeHiddenInput(objDropDown) {
  var upcharge2XL = document.getElementById("hiddenvalue2XL");
  var upcharge3XL = document.getElementById("hiddenvalue3XL");
  upcharge2XL.value = 20.00;
  upcharge3XL.value = 21.00;
}

<select name="amount" size="1" id="Combobox1"  onchange="changeHiddenInput(this)">
  <option value="15.00">Short Sleeve</option>
  <option value="18.00">Long Sleeve</option>
</select><br/>
<select name="os0" size="1" id="Combobox2">
  <option selected>Select Size</option>
  <option value="SS Small">Small</option>
  <option value="SS Medium">Medium</option>
  <option value="SS Large">Large</option>
  <option value="SS XL">XL</option>
  <option value="SS 2XL">2XL + $2</option>
  <option value="SS 3XL">3XL + $3</option>
  <option value="--------">--------</option>
  <option value="SS Youth Small">Youth Small</option>
  <option value="SS Youth Medium">Youth Medium</option>
  <option value="SS Youth Large">Youth Large</option>
</select><br/>
Hidden Paypal Values

<input type="hidden" name="option_select0" value="SS 2XL" id="hiddensize2XL">
<input type="hidden" name="option_amount0" value="17.00" id="hiddenvalue2XL">
<input type="hidden" name="option_select1" value="SS 3XL" id="hiddensize3XL">
<input type="hidden" name="option_amount1" value="18.00" id="hiddenvalue3XL">

Answer 1

Я думаю, что вы имеете в виду это?

document.getElementById("pp1").addEventListener("submit",function(e) {
  e.preventDefault(); // remove this line when finished testing
  const sleeve = document.getElementById("Combobox1").value;
  const size = document.getElementById("Combobox2").value;
  if (sleeve === "" || size === "") {
    alert("Please choose sleeves and size")
    e.preventDefault(); // stop submission
  }
  let amt = sleeve === "SS" ? 15 : 17;
  if (size === "2XL") amt += 2;
  else if (size === "3XL") amt += 3;
  document.getElementById("hiddensize2XL").value=size
  document.getElementById("hiddensize3XL").value=size
  document.getElementById("hiddenvalue2XL").value = amt.toFixed(2)
  document.getElementById("hiddenvalue3XL").value = amt.toFixed(2);
})

<select name="amount" size="1" id="Combobox1">
  <option value="" selected>Sleeves</option>
  <option value="SS">Short Sleeve</option>
  <option value="LS">Long Sleeve</option>
</select><br/>
<select name="os0" size="1" id="Combobox2">
  <option value="" selected>Select Size</option>
  <option value="Small">Small</option>
  <option value="Medium">Medium</option>
  <option value="Large">Large</option>
  <option value="XL">XL</option>
  <option value="2XL">2XL + $2</option>
  <option value="3XL">3XL + $3</option>
  <option value="--------">--------</option>
  <option value="Youth Small">Youth Small</option>
  <option value="Youth Medium">Youth Medium</option>
  <option value="Youth Large">Youth Large</option>
</select><br/>
Hidden Paypal Values

<form id="pp1">
<input type="text" name="option_select0" value="" id="hiddensize2XL">
<input type="text" name="option_amount0" value="17.00" id="hiddenvalue2XL">
<input type="teyxt" name="option_select1" value="" id="hiddensize3XL">
<input type="teyt" name="option_amount1" value="18.00" id="hiddenvalue3XL">
<input type="submit" />
</form>