i am trying to add an h2 element that shows and updating price based on selected option value.
Here is my current code:
<select name="price">
<option value="2799"> 1-6 תשלומים</option>
<option value="3200">12 תשלומים </option>
<option value="2799"> 36 תשלומים</option>
</select>
We can print option value by adding onchange event on it.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<select name="price" onchange="changePrice()">
<option value="2600"> 1-6 תשלומים</option>
<option value="3200">12 תשלומים </option>
<option value="2799"> 36 תשלומים</option>
</select>
<h2 id="id"></h2>
<script>
function changePrice() {
var selector = document.getElementsByName("price")[0];
var value = selector[selector.selectedIndex].value;
document.getElementById('id').innerHTML = value;
}
document.addEventListener("DOMContentLoaded", changePrice);
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With