JSFiddle - React, Tailwind, and code Playground

by Alex Azuero

HTML

<!DOCTYPE html>
<html>
<body>
<fieldset>
<legend>
Field 1
</legend>
<form>
  First name:<br>
  <input type="text" name="firstname">
  <br>
  Last name:<br>
  <input type="text" name="lastname">
  <input type="submit" value="Submit"/>
  <input type="reset" />
</form>
</fieldset>



<select name="options">
<option > choose..</option>
<option value = "a"> Label 3</option>
<option value = "b"> Label 2</option>
<option value = "c" selected> Label 4</option>
</select>

<input type="range"/>

<p>Note that the form itself is not visible.</p>

<p>Also note that the default width of a text input field is 20 characters.</p>

<form>
  <input type="radio" name="gender" value="male" checked> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other  
</form> 
<fieldset>
<legend>
2nd field
</legend>
<p>Enter a number and click OK:</p>

<input id="id1" type="number" min="100" max="300">
<button onclick="myFunction()">OK</button>

<p>If the number is less than 100 or greater than 300, an error message will be displayed.</p>

<p id="demo"></p>
<fieldset/>
<script>
function myFunction() {
    var inpObj = document.getElementById("id1");
    if (inpObj.checkValidity() == false) {
        document.getElementById("demo").innerHTML = inpObj.validationMessage;
    } else {
        document.getElementById("demo").innerHTML = "Input OK";
    } 
} 
</script>
<!--form id="frm1" action="form_action.asp">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Submit">
</form>

<script>
function myFunction() {
    document.getElementById("frm1").submit();
}
</script-->

<p>Enter names in the fields below, then click "Reset" to reset the form.</p>

<form id="frm1">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br-->
  <input type="button" onclick="myFunction()"...