JSFiddle - React, Tailwind, and code Playground

by duarteleao

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Form submission with dropdown</title>
  </head>

  <body>
    <div>
      <input type="checkbox" id="disableDropdownEnter">
      <label for="disableDropdownEnter">Disable Drop-down Enter</label>
    </div>
    <div>
      <h1>Form</h1>
      <form id="form">
        <label>Text: <input type="text" value=""></label>
        <br /><br />
        <label>Text area: <textarea></textarea></label>
        <br /><br />
        <label for="pet-select">Pet:
          <select name="pets" id="pet-select">
            <option value="">--Choose an option--</option>
            <option value="dog">Dog</option>
            <option value="cat">Cat</option>
            <option value="hamster">Hamster</option>
            <option value="parrot">Parrot</option>
            <option value="spider">Spider</option>
            <option value="goldfish">Goldfish</option>
          </select>
        </label>
        <br /><br />
        <button type="submit">Submit</button>
      </form>
      <p id="log"></p>
    </div>
    <div>
      <h1>No Form</h1>
      <div>
        <label>Text: <input type="text" value=""></label>
        <br /><br />
        <label>Text area: <textarea></textarea></label>
        <br /><br />
        <label for="pet-select">Pet:
          <select name="pets" id="pet-select">
            <option value="">--Choose an option--</option>
            <option value="dog">Dog</option>
            <option value="cat">Cat</option>
            <option value="hamster">Hamster</option>
            <option value="parrot">Parrot</option>
            <option value="spider">Spider</option>
            <option value="goldfish">Goldfish</option>
          </select>
        </label>
      </div>
    </div>
    <script>
      const form = document.getElementById("form");
  ...