Basic form validation with JavaScript

I just found an old script developed some years ago that performs form validation without using jQuery or other JavaScript libraries. I think it might be of some historical interest, so I post it here:

var errors = {
 name: "Please enter your name",
 email: "Not a valid email address. Email address format: name@domain.extension.",
 address: "Please enter your address",
 phone: "Not a valid phone number. Phone number format: nnn.nnn.nnnn.",
 errorbg: "#ffc",
 errorborder: "2px solid #f00",
 showError: function (message) {
  var form = document.forms[0];
  var p = document.createElement("p");
  p.className = "error";
  p.appendChild(document.createTextNode(message));
  form.appendChild(p);
 }
 
};

var warning = {
 email: "Email address format: name@domain.extension.",
 phone: "Phone number format: nnn.nnn.nnnn.",
 showEmail: function () {
  var datalist = document.getElementById("data-list");
  var li1 = datalist.getElementsByTagName("li")[1];
  var p = document.createElement("p");
  p.className = "warning";
  p.appendChild(document.createTextNode(this.email));
  li1.appendChild(p);
 },
 showPhone: function () {
  var datalist = document.getElementById("data-list");
  var li2 = datalist.getElementsByTagName("li")[3];
  var p = document.createElement("p");
  p.className = "warning";
  p.appendChild(document.createTextNode(this.phone));
  li2.appendChild(p);
 }

};


function checkForm() {

 var name = document.getElementById("name").value;
 if (name.length == 0) {
  errors.showError(errors.name);
  var hook1 = document.getElementById("name");
  hook1.style.background = errors.errorbg;
  hook1.style.border = errors.errorborder;
 }
 
 
  

 var email = document.getElementById("email").value;
 var re =/^[a-z0-9_+.-]+\@([a-z0-9]+\.)+[a-z0-9]{2,4}$/i;
 if (!email.match(re)) {
  errors.showError(errors.email);
  var hook2 = document.getElementById("email");
  hook2.style.background = errors.errorbg;
  hook2.style.border = errors.errorborder;
 }
 
 
 var address = document.getElementById("address").value;
 if (address.length == 0) {
  errors.showError(errors.address);
  var hook3 = document.getElementById("address");
  hook3.style.background = errors.errorbg;
  hook3.style.border = errors.errorborder;
 }
 
 
 var phone = document.getElementById("phone").value;
 var re2 = /(\d{3}).(\d{3}).(\d{4})/;
 if (!phone.match(re2)) {
  errors.showError(errors.phone);
  var hook4 = document.getElementById("phone");
  hook4.style.background = errors.errorbg;
  hook4.style.border = errors.errorborder;
 }
 
 if (name.length > 0 && email.match(re) && address.length > 0
     && phone.match(re2) ) {
     return true;
 }
 
 else {
  return false;
 }
 
 
 
 
}

function showResults() {
 var form = document.forms[0];
 var results = document.createElement("div");
 results.id = "results";
 results.innerHTML = "<div class='topright'><div class='bottomleft'><div class='bottomright'>" + "Your data have been saved." +
     "</div></div></div>";
 form.appendChild(results);
}
 
 

window.onload = function() {
 var dataform = document.getElementById("data");
 dataform.action = "javascript:showResults()";
 dataform.onsubmit = checkForm;
 
 var hook5 = document.getElementById("showemail");
 hook5.href = "javascript: warning.showEmail()";
 
 var hook6 = document.getElementById("showphone");
 hook6.href = "javascript: warning.showPhone()";
 
 
 
 
}

The interesting thing to note here is that I used object literals to store error and warning messages. Using object literals is surely a good and easy way to store such a data type within a script.