TIDBIT: Массив пар ключ-значение из FormData

Я недавно столкнулся с ситуацией, когда мне нужно превратить некоторые данные формы в массив пар ключ-значение, где ключом является имя input.

<!DOCTYPE html>
<html>
<body>

<form>
  <label for="first">First name</label>
  <input type="text" name="first"/>
  <label for="last">Last name</label>
  <input type="text" name="last"/>
  <label for="age">Age</label>
  <input type="number" name="age"/>
  <button type="button" id="btn">Click</button>
</form>

<script>
document.querySelector("#btn").addEventListener('click', () => {
  const inputs = new FormData(document.querySelector("form"));
  const entries = Object.fromEntries(inputs);
  const options = Object.entries(entries).map(([key, value]) => ({ key, value }));
  console.log(options);
/**
[
    {
        "key": "first",
        "value": ""
    },
    {
        "key": "last",
        "value": ""
    },
    {
        "key": "age",
        "value": ""
    }
]
*/
})
</script>
</body>
</html>
Вход в полноэкранный режим Выйти из полноэкранного режима

Примечание: это не будет работать для мультивыбора

Оцените статью
devanswers.ru
Добавить комментарий