Assignment 2

by pphheerroonn

HTML

<form name="q2Form" action="#" onsubmit="return false">
    <label for="pindigits">4 Digit Pin:</label><br>
    <input type="password" name="pindigits" pattern="[0-9]{4}" maxlength="4"><br>
    <input type="checkbox" name="marketingemail"><label for="marketingemail">I wish to be contacted by email</label><br>
    <label for="email">Email Address:</label><br> 
    <input type="email" name="email"><br>
    <label for="pet">Do you have a Pet?:</label><br> 
    <input type="radio" name="pet" value="dog">Dog <br>
    <input type="radio" name="pet" value="cat">Cat <br>
    <input type="radio" name="pet" value="other"> Other <br>
    <label class="pethidden" for="otherpet">You selected other, please tell us which pet:</label><br> 
    <input class="pethidden" type="text" name="otherpet" pattern=".{6}"><br>
    <!--<button type="button" onclick="submitForm()">Submit</button>-->
    <input type="submit" value="Submit" onclick="submitForm()">
</form>
<div id="result">
</div>
<script>
function updateForm() {

}

function submitForm() {



    validateForm();
    document.getElementById("result").innerHTML = "Inputs are Valid";
        
    return false;
}

function validateForm() {
  var pin = document.forms["q2Form"]["pindigits"].value;
  var marketingemail = document.forms["q2Form"]["marketingemail"].value;
  var email = document.forms["q2Form"]["email"].value;
  var pet = document.forms["q2Form"]["pet"].value;
  var pin = document.forms["q2Form"]["pindigits"].value;
  if (pet == "other") {
    div = document.getElementsByClassName("pethidden");
    div[0].style.display = "block";
    div[1].style.display = "block";
    return false;
  }
  
}


</script>

<style>
.pethidden{
    display:none;}
</style>