JSFiddle - React, Tailwind, and code Playground

by Alan Tang

HTML

<form id="myForm" onsubmit="return valfunc()" onreset="return resetfunc()">
          <div class="container">
            <div id="usrnm">
              <label class="control-label">Username: </label>
              <input class="form-control" type="text" name="username" id="username">
            </div>
            <div id="pswrd">
              <label class="control-label">Password: </label>
              <input class="form-control" type="password" name="password" id="password">
            </div>
            <div id="cnfrm">
              <label class="control-label">Confirm: </label>
              <input class="form-control" type="password" name="confirm" id="confirm">
            </div>
            <div id="ag">
              <label class="control-label">Age: </label>
              <input class="form-control" align:"right" type="text" name="age" id="age"> <br>
            </div>
          </div>

           <div class="buttons">
            <input type="submit" id="submit" class="btn btn-primary" onsubmit="valfunc()">
            <input type="reset" id="resetbutton" class="btn btn-default" onreset="resetfunc()">
           </div>
        </form>

JavaScript

function resetfunc(){
          var form = document.getElementById("myForm");
          form.reset();
          //document.getElementById("output").innerHTML = "";
          //document.getElementById("cnfrm").className.clear;
          //document.getElementById("output").style.visibility = "hidden";
          console.log("resetfunc");
          return false;
}