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
Your Answer
To place the code, please use CodePen or similar tool. Thanks you!