How can you modify the calculator on the site to connect the datalist slider to the function?

• 0
  I have a small calculator on my website that does the calculation of the total after choosing a few options. I would like to add (for convenience) the following datalist "slider" consisting of 10 positions:
  
  

  <datalist id="rangeList">
  <option value="4" label="4">
  <option value="5" label="5">
  <option value="6" label="6">
  <option value="7" label="7">
  <option value="8" label="8">
  <option value="9" label="9">
  <option value="10" label="10">
  <option value="11" label="11">
  <option value="12" label="12">
  <option value="13" label="13">
  <option value="14" label="14">
  <option value="15" label="15">
  </datalist>

  
  
  and so that when you move the slider, the total amount of calculations will change automatically, with each step of movement - by value = "0_ + 100". how can I correctly add class = "", id = "", name = "" to the option value of this datalist so that the calculations are done. Here is the code snippet for this calculator:
  
  

  <div class="heady">
  <input type="hidden" name="invote" class="invote">
  <select name="srok" class="inputbox headnot">
  <option value="0" sumfor="headnot">Выберите кол-во эффектов</option>
  <option value="0_*1" sumup="10">1 эффект</option>
  <option value="0_*1.5" sumup="20">2 эффекта</option>
  <option value="0_*1.9" sumup="50">3 эффекта</option>
  <option value="0_*2.4" sumup="70" >4 эффекта</option>
  <option value="0_*3.0" sumup="100">5 эффектов</option>
  <option value="0_*3.7" sumup="200">6 эффектов</option>
  <option value="0_*4.5" sumup="300">7 эффектов</option>
  <option value="0_*5.4" sumup="400">8 эффектов</option>
  <option value="0_*6.5" sumup="500">9 эффектов</option>
  </select>
  <div class="heady">
  <select name="sel[]" class="inputbox plag">
  <option value="0_+0" sumend="0" class="headnot">Выберите опции вставки текста</option>
  <option value="0_+0" sumend="0" class="headnot">Мне не нужно показывать текст</option>
  <option value="0_+500"  sumend="0" class="headnot">Вставка вашего текста в кол-ве, как в примере</option>
  <option value="0_+800"  sumend="0" class="headnot">Вставка вашего текста более 30-50% чем в примере</option>
  <option value="0_+1000"  sumend="0" class="headnot">Вставка вашего текста более 50-80% чем в примере</option>
  <option value="0_+1200"  sumend="0" class="headnot">Вставка вашего текста более 50-80% чем в примере</option>
  </select>
  </div>
  <div class="count variant">
  <input type="hidden" name="countone" class="countone" value="promt">
  <label class="myCheckbox"><input type="radio"  class="plat" name="plat" value="0_+0" checked="checked"><span class="chk"></span>Нет</label>
  <label style="color: #0823C0" class="myCheckbox"><input type="radio" class="plat" name="plat" value="0_+200"><span class="chk"></span>SD карта</label>
  <label style="color: #0823C0" class="myCheckbox"><input type="radio" class="plat" name="plat" value="0_+300"><span class="chk"></span>DVD запись</label></div>

  JavaScript Anonymous, Jul 12, 2019

---

0 Answers