Автоматическое заполнение форм - PullRequest
0 голосов
/ 08 июля 2019

Я ищу способ автоматизации формы.
Вот подробности:

  1. Извлечение определенного числа (отображается в html)
  2. Выполнить некоторые вычисления для извлеченного числа (в процентах от этого числа)
  3. Затем автоматически заполняет оставшиеся поля ввода результатом, а не печатает его.

1 Ответ

0 голосов
/ 08 июля 2019

Это обычное явление в формах. Решение зависит от того, какую платформу / библиотеки вы используете. Предполагая, что вы не используете ни один, вот как вы можете это сделать:

https://jsfiddle.net/f52h1smj/1/

грубый HTML:

<form>
  <label for="number">Number: </label>
  <input id="number" type="number" />
  <br /> <br />
  <label for="calculatedNumber">Calculated Number (50%): </label>
  <input id="calculatedNumber" type="number" disabled="true" />
</form>

JS:

(() => {
  //get the form element nodes 
  const $number = document.getElementById("number");
  const $calculatedNumber = document.getElementById("calculatedNumber");

  //add an event listen to the value you're going to use to pre calculate the other fields
  $number.addEventListener("keyup", (e) => {
    //it's value is available like so
    const value = e.target.value;
    //do some validation so that you're calculations don't throw exceptions
    if (Number(value) !== 0 && !Number.isNaN(value)) {
      //set the value of the other inputs to whatever you like by setting the 'value' property of the node. 
      $calculatedNumber.value = value / 2;
    } else {
      $calculatedNumber.value = null;
    }
  });
})();

Эти вещи становятся намного проще в таких средах, как React и Angular.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...