JSFiddle - React, Tailwind, and code Playground

by stevenkaspar

HTML

<h3><i>Begin by entering your requested order below</i><h3>
<form action="#" method="post" id="delInfo">
	Zip Code:<br>
	<input type="text" name="zipcode" id="zipcode"><br>
	<p><i>Delivery fee will be calculated based on zip code</i><p>
	First Name:<br>
	<input type="text" name="firstname" id="firstname"><br/>
	Last Name:<br>
	<input type="text" name="streetaddress" id="lastname"><br/>
	Street Address:<br>
	<input type="text" name="zipcode" id="address"><br/>
	Email Address:<br>
	<input type="text" name="email"><br/>
	<input type="submit" value="Submit">
	
	
</form>

JavaScript

document.addEventListener('DOMContentLoaded', function(){

var zip            = document.getElementById('zipcode');
// when the zip input value changes it will alert the user
zip.addEventListener('change', zipCalc)

var firstname      = document.getElementById('firstname');
var lastname       = document.getElementById('lastname');
var street_address = document.getElementById('address');
var email          = document.getElementById('emailaddress');

function zipCalc(e) {
    zip_input_val = zip.value;
    if (zip_input_val == 32231) {
        alert("your fee added delivery fee will be 2 dollars.")
    }
    else {
        alert('We cant calculate your cost');
    }
}

})