- Javascript / jQuery form validation
- function new_receiver(){
- if (document.getElementById("RecieversName").value ==""){ //First Name
- var txt=document.getElementById("error_receiver");
- txt.innerHTML="<p><font color="#FF0000">You need to enter a Name!</font></p>";
- window.document.getElementById("RecieversName_label").style.color = '#FF0000';
- //Reset
- window.document.getElementById("receiver_check_label").style.color = '#000000';
- window.document.getElementById("RecieversNumber_label").style.color = '#000000';
- window.document.getElementById("RecieversEmail_label").style.color = '#000000';
- }else if (document.getElementById("RecieversNumber").value ==""){ //First Name
- var txt=document.getElementById("error_receiver");
- txt.innerHTML="<p><font color="#FF0000">You need to enter a Phone Number!</font></p>";
- window.document.getElementById("RecieversNumber_label").style.color = '#FF0000';
- //Reset
- window.document.getElementById("receiver_check_label").style.color = '#000000';
- window.document.getElementById("RecieversName_label").style.color = '#000000';
- window.document.getElementById("RecieversEmail_label").style.color = '#000000'
- }else if (document.getElementById("RecieversNumber").value ==""){ //First Name
- var txt=document.getElementById("error_receiver");
- txt.innerHTML="<p><font color="#FF0000">You need to enter an Email!</font></p>";
- window.document.getElementById("RecieversEmail_label").style.color = '#FF0000';
- //Reset
- window.document.getElementById("receiver_check_label").style.color = '#000000';
- window.document.getElementById("RecieversName_label").style.color = '#000000';
- window.document.getElementById("RecieversNumber_label").style.color = '#000000';
- }else{
- from.receiver.submit();
- function new_receiver() {
- var inputs = [
- {
- id: "RecieversName",
- name: "a Name"
- },
- {
- id: "RecieversNumber",
- name: "a Phone Number"
- }
- // add more here
- ],
- length = inputs.length,
- error = document.getElementById("error_receiver"),
- hasError = false,
- i;
- // reset
- for (i = 0; i < length; i++) {
- document.getElementById(inputs[i].id + "_label").style.color = "#000000";
- }
- error.innerHTML = "";
- for (i = 0; i < length; i++) {
- if (document.getElementById(inputs[i].id).value == "") {
- error.innerHTML = "<p><font color="#FF0000">You need to enter " + inputs[i].name + "!</font></p>";
- document.getElementById(inputs[i].id + "_label").style.color = "#FF0000";
- hasError = true;
- break;
- }
- }
- if (!hasError) {
- from.receiver.submit();
- }
- }
- $('input').blur(function() {
- if($(this).val()==""){
- $("#error_receiver").html("<p><font color="#FF0000">This field is required!");
- $("label[for=' + this.attr("id") + ']").css('color', '#FF0000');
- }
- });
- <form onsubmit="return new_receiver()">
- .
- .
- var formFields = {
- "RecieversName": "You need to enter a Name!",
- "RecieversNumber":"You need to enter a Number!",
- "RecieversEmail":"You need to enter an Email!"
- }
- function new_receiver(){
- var txt=document.getElementById("error_receiver");
- //Reset
- txt.innerHTML="";
- for (var o in formFields) document.getElementById(o+"_label").style.color = '#000000';
- for (var o in formFields) {
- if (document.getElementById(o).value ==""){
- txt.innerHTML="<p><font color="#FF0000">"+formFields[o]+"</font></p>";
- window.document.getElementById(o+"_label").style.color = '#FF0000';
- return false;
- }
- }
- return true
- }