Alert selected optiosn

by TimeRunner2359

HTML

<div>
	<select name="color" class='select' >
		<option value="" disabled selected>انتخاب رنگ</option>
		<option value="1">قرمز</option>
		<option value="20">آبی</option>
		<option value="14">سبز</option>
	</select>
</div>
<div>
	<select name="ram" class='select' >
		<option value="" disabled selected>انتخاب رم</option>
		<option value="2">رم 6</option>
		<option value="66">رم 8</option>
	</select>
</div>
<div>
<!-- فرض کنیم در این‌جا مقدار (500 گیگ ) از قبل انتخاب شده است  -->
	<select name="color" class='select' >
		<option value="" disabled >انتخاب هارد</option>
		<option value="31" selected>500 گیگ</option>
		<option value="27">1 ترابایت</option>
	</select>

CSS

div{padding: 5px; margin:  5px;}

JavaScript

let selects = document.querySelectorAll('.select');
var i = 0
let values = [];
selects.forEach(function (select) {
//giving id to each select
	select.id = i;
  i++;
  let index = select.id;
  let value = select.options[select.selectedIndex].value;

  if(value != ''){
  			values[index] = value;
  }
	select.addEventListener('change', function () {
		let updatedValue = select.options[select.selectedIndex].value;
			values[index] = updatedValue;
			alert(values);
	});
});